Video 26-1 What is Event, different types of event in web
DOM er ajker Events
Video 26-2 Add onclick handler directly or via javascript
DOM er ajker Events
Video 26-3 Different ways to use addEventListener on a button
Video 26-4 Most common ways to set Event Handlers
Final Dom Event Handlers
Default Input text
Default Text
Video 26-5 Create a comment box and display comment
Please add your coment
Lorem ipsum dolor sit amet consectetur adipisicing elit. Similique sapiente dolore laborum. Enim architecto, cumque pariatur a, magnam eaque suscipit facilis magni dolore similique quae. Fuga unde voluptate harum doloribus dicta similique nisi sed ut recusandae consequatur tempora excepturi molestiae, cum tempore natus quos illum, temporibus quod accusantium facere autem.
Similique sapiente voluptatibus omnis nihil consectetur error fugiat officia exercitationem aliquam itaque. Est provident nesciunt eos sunt magni saepe, quod, perspiciatis soluta accusamus, culpa deleniti? Numquam recusandae eligendi explicabo at doloremque id. Neque voluptatibus libero eius sint similique, accusantium repellat quae nihil asperiores nemo ex cupiditate velit, illo dicta dignissimos.
Animi voluptas saepe accusantium soluta, fugit eum necessitatibus itaque eligendi sequi perferendis, recusandae iusto libero enim earum corrupti vel ex natus repudiandae similique nisi quia illo amet, deserunt reprehenderit? Tempora ipsum vero, minima provident adipisci esse, dignissimos dolor, corrupti accusamus necessitatibus doloremque ipsam neque quidem soluta inventore repellat natus maxime!
Video 26-6 Simple github like delete confirmation button
Explore more events
My Secret info
Video 26-7 (semi-advanced) Event bubble and Stop propagating
Exploring Event Bubble
Lorem, ipsum.
Dolorem, alias.
Atque, molestiae.
Unde, molestias!
Quasi, possimus!
Repellendus, quas.
Video 26-8 (advanced) Event delegate and benefit of Event bubble
Explore Event Delegate
Lorem, ipsum dolor.
Ex, repudiandae. Ad!
Accusantium, saepe dignissimos.
Sit, ipsam excepturi.
Perspiciatis, odio fugit.
Illo, fugit est.
Video 26-9 DOM events summary and home work
Explore DOM Events
QUIZ
Q1: What is an event on a website?
Ans: All of the above
Q2: Which one is not a keyboard event?
Ans: keyhug
Q3: How will you add the purchaseProduct function for clicking on the button?
Ans: onclick = "purchaseProduct()
Q4: How will you add a click handler?
document.getElementById(‘order’)_____?____(‘click’, function(){ })
Ans: .addEventListener
Q5: What is a callback function in javascript? (google it)
Ans: Pass a function as a parameter
Q6: What is the event bubble? (if needed google it. Also note: it’s a common interview question)
Ans: Propagating an event from the lowest to the upward
Q7: How can you access the inner content of a text input field?
Ans: value
Q8: Select the first element with the selector statement
.main .title .t1
Ans: document.querySelector(".main.title.t1")
Q9: Select the parent element of the element elm using one of the following choices.
Ans: elm.parentNode()
Q10: How will you get text inside an input tag?
event.__?__ ;
Ans: target.value
Lorem ipsum dolor sit amet consectetur adipisicing elit. Similique sapiente dolore laborum. Enim architecto, cumque pariatur a, magnam eaque suscipit facilis magni dolore similique quae. Fuga unde voluptate harum doloribus dicta similique nisi sed ut recusandae consequatur tempora excepturi molestiae, cum tempore natus quos illum, temporibus quod accusantium facere autem.
Similique sapiente voluptatibus omnis nihil consectetur error fugiat officia exercitationem aliquam itaque. Est provident nesciunt eos sunt magni saepe, quod, perspiciatis soluta accusamus, culpa deleniti? Numquam recusandae eligendi explicabo at doloremque id. Neque voluptatibus libero eius sint similique, accusantium repellat quae nihil asperiores nemo ex cupiditate velit, illo dicta dignissimos.
Animi voluptas saepe accusantium soluta, fugit eum necessitatibus itaque eligendi sequi perferendis, recusandae iusto libero enim earum corrupti vel ex natus repudiandae similique nisi quia illo amet, deserunt reprehenderit? Tempora ipsum vero, minima provident adipisci esse, dignissimos dolor, corrupti accusamus necessitatibus doloremque ipsam neque quidem soluta inventore repellat natus maxime!