Multiple Choice Questions on Handling Mouse Clicks in Web Pages

📚 Quick Study Guide

• 🖱️ Mouse events are fundamental for user interaction in web development.
• 👂 The main event listeners for mouse clicks are `onclick`, `onmousedown`, and `onmouseup`.
• ☝️ The `onclick` event is triggered when a mouse click occurs on an element.
• 👇 The `onmousedown` event is triggered when a mouse button is pressed down on an element.
• 👆 The `onmouseup` event is triggered when a mouse button is released over an element.
• 🎯 Event objects provide information about the event, such as the mouse coordinates.
• 🛑 Preventing default behaviors (e.g., context menus) can be achieved using `event.preventDefault()`.
• 💡 Different mouse buttons can be identified using the `event.button` property (0 for left, 1 for middle, 2 for right).

🧪 Practice Quiz

1. Which event is triggered when a user clicks on an HTML element?
   1. onmouseover
   2. onclick
   3. onkeydown
   4. onload
2. Which event is triggered when a mouse button is pressed down on an element?
   1. onclick
   2. onmouseup
   3. onmousedown
   4. onkeypress
3. Which event is triggered when a mouse button is released over an element?
   1. onclick
   2. onmousedown
   3. onmouseup
   4. onmouseout
4. What does event.preventDefault() do?
   1. Stops the event from propagating up the DOM tree.
   2. Prevents the default action of the element.
   3. Triggers the default action of the element.
   4. Reloads the page.
5. Which property of the event object provides information about which mouse button was pressed?
   1. event.type
   2. event.target
   3. event.button
   4. event.key
6. What value of event.button represents the left mouse button?
   1. 1
   2. 2
   3. 0
   4. 3
7. Which of the following is the correct way to add an event listener to an element using JavaScript?
   1. element.addEventListener('click', function(){});
   2. element.onclick = function(){};
   3. Both A and B
   4. None of the above