Posts

Learn how to add and remove a class name to an element with angular

Image
Learn how to add and remove a class name to an element with angular   We can able to add and remove a class to an element in angular. In the following example, we have added/removed a class for the input element using a button component.   Example :   Video  tutorial :   https://youtu.be/vMM05geNQJ4   [app.component.html] <input   class = "myInput"   type = "text"   value = "subscribe for more videos"   /> <br   /> <button   (click) = "addClass()"   class = "button" > Add Class </button> <button   (click) = "romveClass()"   class = "button" > Remove Class </button>   [app.component.css] .myInput  {    font-weight :  bold ; } .inputStyle  {    width :  300px ;    color :  coral ;    border-radius :  5px ;    height :  25px ;    padding :  3px ; } .button  {    color :  aliceblue ;    backgrou

HTML DOM Document addEventListener() - JavaScript

Image
  HTML DOM Document addEventListener()   The addEventListener() method  allows you to add event listeners on any HTML DOM object such as HTML elements, the HTML document, the window object, or other objects that support events, like the xmlHttpRequest object.   Example : Video  tutorial :  https://youtu.be/80yHjjWJeC4 [index.html] <input   id = "inputElement"   type = "text"   value = "Example" /> <button   id = "buttonElement" > Update </button>   [script.js] document . getElementById ( 'buttonElement' ). addEventListener ( 'click' , function (){    var   InputEle  =  document . getElementById ( 'inputElement' );    InputEle . value  =  'subscribe for more videos' ; });   Sample : https://stackblitz.com/edit/js-qghp6q?file=index.html&file=index.js