Learning about Javascript, HTML, & Web API, Event Listeners, Callback Functions, (Inside Event Listeners), Streams, DOM Emitting Events
DOM, HTML, addEventListener

 

Me working below on replacing, concatenating and adding an event listener on elements. 

HTML DOM emits a kind of stream of outputs on "events" like, "click", "scroll", and most fundamentally, "change." You can also customize your own "event". Any existing Web API events, or your own customized event, you can then "listen" to that event. The DOM element automatically emits a new snapshot of itself on the event. And you can write "callback" functions to take the argument of that snapshot output ("event") and do stuff with it, e.g., post it to the console.log, or add it elsewhere back into the DOM, or whatever you want.

 

166   var aphrodite_style_option = document.createElement("option");

167   var booking_day = document.getElementById("booking_starts_at_1x");

168   var booking_month = document.getElementById("booking_starts_at_2x");

169   var booking_year = document.getElementById("booking_starts_at_3x");

170   var booking_request_date = booking_day.value + booking_month.value +  booking_year.value;

171   var aphrodite_style_textnode = document.createTextNode(booking_request_date);

172   var transfer_new_booking = document.getElementById("transfer_new_booking");

173   transfer_new_booking.appendChild(aphrodite_style_textnode);

174

175

176   booking_day.addEventListener("change", function(event){

177     console.log(event.target.value)

178   })

179 </script>

 


Tim explaining Callback functions to me:

  1. function abstractMethod( eventName, callback ){
  2.   varevent="test"
  3.   if(eventName ==="change"){
  4.     callback(event)
  5.   }
  6. }
  7. abstractMethod('change',function(event){
  8.   console.log(event)
  9. })
  10. #############################################################
  11. def abstract_method( eventName, callback)
  12.   event="test"
  13.   if eventName =="change"
  14.     callback(event)
  15.   end
  16. end
  17. def callbackMethod(event)
  18. end
  19. abstract_method("change", callbackMethod)
| Back

Footerfull