Consider the following HTML code: <button id="myButton">Click me</button> Which JavaScript code adds a click event listener to the button? | JavaScript | MYTAT

Click me Which JavaScript code adds a click event listener to the button? | JavaScript | MYTAT"> Click me Which JavaScript code adds a click event listener to the button? | JavaScript | MYTAT">

Q

Consider the following HTML code: Which JavaScript code adds a click event listener to the button?

A). document.getElementById('myButton').onclick = function() { alert('Button clicked'); }; B). document.getElementById('myButton').addEventListener('click', function() { alert('Button clicked'); }); C). document.getElementById('myButton').click(function() { alert('Button clicked'); }); D). document.getElementById('myButton').on('click', function() { alert('Button clicked'); });

Answer & Solution

Answer: Option B

Solution:

The correct way to add a click event listener to the button with the ID myButton is by using the addEventListener() method as shown in Option B. This method ensures proper event handling and allows for attaching multiple event listeners to the same element without overwriting existing ones.

Related Questions on Average

Which event is triggered when a web page finishes loading?

A). A. onload

B). B. onsubmit

C). C. onmouseover

D). D. onclick

View Answer

Consider the following JavaScript code: document.addEventListener('keypress', function(event) { console.log('Key pressed:', event.key); }); What does this code do?

A). A. Adds a click event listener to the document

B). B. Adds a keypress event listener to the document

C). C. Removes a keypress event listener from the document

D). D. Checks if a key is pressed while hovering over an element

View Answer

What is the purpose of the onclick attribute in HTML elements?

A). A. To define styles for HTML elements

B). B. To attach event listeners for mouse clicks

C). C. To insert JavaScript code directly into HTML

D). D. To create animations for HTML elements

View Answer

In JavaScript, what is the purpose of the addEventListener() method?

A). A. To create inline event handlers

B). B. To attach event listeners to HTML elements

C). C. To remove event listeners from HTML elements

D). D. To bind event handlers to parent elements

View Answer

Which type of JavaScript function is defined without a name?

A). A. Named function

B). B. Anonymous function

C). C. Arrow function

D). D. Generator function

View Answer

What is the purpose of the onmouseover event in HTML?

A). A. To detect when an element is hovered over

B). B. To track changes in form inputs

C). C. To determine when an element is loaded

D). D. To handle form submissions

View Answer

Which event is triggered when a user clicks on an HTML element?

A). A. onhover

B). B. onsubmit

C). C. onload

D). D. onclick

View Answer

Which of the following correctly defines a JavaScript function?

A). A. function addNumbers(num1, num2) { return num1 + num2; }

B). B. function = addNumbers(num1, num2) { return num1 + num2; }

C). C. function addNumbers(num1 + num2) { return num1 + num2; }

D). D. function addNumbers(num1, num2) => { return num1 + num2; }

View Answer

What is the purpose of parameters in a JavaScript function?

A). A. To return a value from the function

B). B. To define the function's name

C). C. To store variables within the function

D). D. To accept inputs into the function

View Answer

What is the purpose of an event in JavaScript?

A). A. To add styles to HTML elements

B). B. To handle user interactions and browser actions

C). C. To define function names

D). D. To create animations on web pages

View Answer