Section 14 Advanced DOM Manipulation + Problem Set

Blogging Questions


when adding an event listener methods there are two arguments that are passed, the first is the event being listened for while the other argument is a function. These two rely on one another. The event being listened for, when activated such as a “click” causes the function to run.

//examples with anonymous function

for(var i = 0; i < squares.length; i++){ 
 squares[i].addEventListener("click", function(){
			var clickedColor = this.style.backgroundColor = "red";
       }

  squares[i].addEventListener("mouseover", function(){

                      var transparent = this.style.opacticy = 0;
                    }
}

// these two event listeners accomplish two different goals, the first one changes backgroud color of an elemt when clicked while the second one changes the opacity when hover over

// its important to note that anonymous function can only be used in the instance that is was created in while a declared function can be used every where. in other word anonymous functions can only be used where they are declared. 

function f_one(){
   //random code
}

function f_two(){
   //random code

}


for(var i = 0; i < squares.length; i++){ 
      squares[i].addEventListener("mousemove", f_one())
      squares[i].addEventListener("mouseover", function())
}

// these event listeners will execute code stated in function declaration

Leave a comment

Your email address will not be published. Required fields are marked *

css.php