(1) What is the purpose of a while loop in JavaScript?
A) To execute code once
B) To execute code a fixed number of times
C) To execute code while a condition is true
D) To stop execution of code
Answer: C) To execute code while a condition is true
Explanation: A while loop continues running its block as long as the specified condition remains true.
(2) What is the output of the following code?
var i = 1;
while (i <= 3) {
document.write(i);
i++;
}
A) 123
B) 012
C) 321
D) Infinite loop
Answer: A) 123
Explanation: The loop starts at 1 and increments until 3, printing each value.
(3) What must happen inside a while loop to avoid an infinite loop?
A) Add a semicolon
B) Decrease a variable
C) Change the loop condition value
D) Alert the user
Answer: C) Change the loop condition value
Explanation: If the condition value never changes, the loop will run forever.
(4) Which condition will stop this loop?
var num = 10;
while (num > 0) {
num--;
}
A) num == 10
B) num < 0
C) num == 0
D) num > 0
Answer: C) num == 0
Explanation: The loop continues as long as num > 0, so it stops when num becomes 0.
(5) What will happen if the condition in a while loop is always true?
A) The loop will not run
B) The loop will run once
C) It will result in an error
D) It will run forever (infinite loop)
Answer: D) It will run forever (infinite loop)
Explanation: A condition that’s always true causes the loop to run without stopping unless a break is used.
(6) What is the difference between a while loop and a for loop?
A) for loop has no condition
B) while loop runs only once
C) for loop has initialization, condition, and increment in one line
D) There is no difference
Answer: C) for loop has initialization, condition, and increment in one line
Explanation: The for loop’s syntax includes all three elements in one line, whereas the while loop separates them.
(7) What will this code output?
var x = 5;
while (x > 0) {
alert(x);
x--;
}
A) 0 1 2 3 4
B) 5 4 3 2 1
C) Infinite loop
D) Nothing
Answer: B) 5 4 3 2 1
Explanation: The loop starts at 5 and decrements x each time until x is no longer greater than 0.
(8) Which of the following conditions will make the while loop run?
A) false
B) 0
C) true
D) "" (empty string)
Answer: C) true
Explanation: The while loop only runs when the condition evaluates to true. true is a truthy value.
(9) What is a common mistake that leads to infinite while loops?
A) Forgetting to close brackets
B) Using alert() in loop
C) Not updating the loop variable
D) Using let instead of var
Answer: C) Not updating the loop variable
Explanation: If the variable in the loop condition isn’t updated, the loop condition may stay true forever.
(10) Which of the following is the correct syntax for a while loop?
A) while condition { }
B) while (condition) { }
C) while = (condition) { }
D) while: (condition) { }
Answer: B) while (condition) { }
Explanation: The correct JavaScript syntax for a while loop is: while (condition) { // code }
(Chap # 42 - Do-while loops)
(1) What is the main difference between a while loop and a do...while loop?
A) The do...while loop runs at least once, while a while loop may not run at all
B) A while loop always runs
C) The do...while loop has a different syntax
D) There is no difference
Answer: A) The do...while loop runs at least once, while a while loop may not run at all
Explanation: A do...while loop executes the code block at least once before checking the condition, whereas a while loop checks the condition first.
(2) What will be the output of the following code?
var i = 0;
do {
alert(i);
i++;
} while (i < 3);
A) 0 1 2
B) 1 2 3
C) Infinite loop
D) 3 2 1
Answer: A) 0 1 2
Explanation: The do...while loop runs the code block at least once and then checks the condition. It prints 0, 1, and 2 before terminating.
(3) What will happen if the condition in a do...while loop is false from the beginning?
A) The loop will run once and then stop
B) The loop will run infinitely
C) The loop will never run
D) An error will occur
Answer: A) The loop will run once and then stop
Explanation: Since the do...while loop executes at least once before checking the condition, it will run once even if the condition is false.
(4) What is the correct syntax for a do...while loop?
A) do { // code } while (condition);
B) do while (condition) { // code }
C) while (condition) do { // code }
D) do (condition) { // code }
Answer: A) do { // code } while (condition);
Explanation: The correct syntax is to write the code block first, followed by the condition after the while keyword.
(5) Which of the following is true about the do...while loop?
A) The loop always executes at least once
B) The loop may never execute
C) The loop only runs when the condition is true
D) The loop executes an infinite number of times
Answer: A) The loop always executes at least once
Explanation: In a do...while loop, the code block is executed first, then the condition is evaluated. Therefore, the loop runs at least once.
(6) What will happen if the condition in a do...while loop is always true?
A) The loop will run infinitely
B) The loop will run once
C) The loop will run and then stop after some iterations
D) The program will throw an error
Answer: A) The loop will run infinitely
Explanation: If the condition always evaluates to true, the loop will continue indefinitely unless explicitly broken out of.
(7) What will be the output of this code?
var x = 3;
do {
alert(x);
x--;
} while (x > 0);
A) 3 2 1
B) 0 1 2
C) 1 2 3
D) Infinite loop
Answer: A) 3 2 1
Explanation: The loop executes the code block at least once and decreases x by 1 in each iteration until x is no longer greater than 0.
(8) How can you stop a do...while loop early?
A) Use the break statement
B) Change the condition to false
C) Remove the code inside the loop
D) The loop will stop by itself after one iteration
Answer: A) Use the break statement
Explanation: The break statement can be used to terminate the loop early, even if the condition is still true.
(9) What happens when you omit the semicolon at the end of the condition in a do...while loop?
A) Syntax error
B) The loop will still work without issue
C) The loop will run indefinitely
D) The code inside the loop will not execute
Answer: A) Syntax error
Explanation: A semicolon is required to terminate the condition in a do...while loop. Omitting it will result in a syntax error.
(10) Which of the following is a valid use case for a do...while loop?
A) When you want to check a condition before executing the loop body
B) When the loop body should execute at least once regardless of the condition
C) When you need to execute a loop infinitely
D) When you want the loop body to run in reverse order
Answer: B) When the loop body should execute at least once regardless of the condition
Explanation: A do...while loop is useful when you need to ensure that the loop body is executed at least once before checking the condition.
(Chap # 43 - placing scripts)
(1) How do you define a link in HTML that triggers a JavaScript function on click?
A) href="javascript:void(0)" onclick="myFunction()"
B) href="myFunction()"
C) href="javascript:myFunction()"
D) onclick="myFunction()"
Answer: A) href="javascript:void(0)" onclick="myFunction()"
Explanation: To trigger a JavaScript function on click without navigating to another page, use `href="javascript:void(0)"` and define the `onclick` handler.
(2) What does the `this` keyword refer to in the context of a link event handler?
A) The event object
B) The link element that was clicked
C) The global object
D) The function itself
Answer: B) The link element that was clicked
Explanation: In an event handler, `this` refers to the element that triggered the event—in this case, the link that was clicked.
(3) Which of the following is the correct syntax for preventing the default action of a link?
A) `event.stopPropagation()`
B) `event.preventDefault()`
C) `event.cancelDefault()`
D) `event.preventAction()`
Answer: B) `event.preventDefault()`
Explanation: `event.preventDefault()` is used to prevent the default behavior of a link, such as navigating to the URL specified in the `href` attribute.
(4) What does the `this.href` property represent in a link event handler?
A) The event object
B) The URL that the link points to
C) The name of the link element
D) The text content of the link
Answer: B) The URL that the link points to
Explanation: `this.href` gives access to the URL specified in the `href` attribute of the link element that triggered the event.
(5) How can you create a link that opens a new window when clicked?
A) href="url" target="new"
B) href="url" target="_blank"
C) href="url" onclick="window.open()"
D) Both B and C
Answer: D) Both B and C
Explanation: Both methods can be used to open a new window. Using `target="_blank"` in the `href` attribute or calling `window.open()` in the `onclick` event handler.
(Chap # 44 - Commenting)
(1) What is the purpose of comments in JavaScript?
A) To store values
B) To execute code
C) To provide explanations or notes about the code
D) To define variables
Answer: C) To provide explanations or notes about the code
Explanation: Comments are used to add explanatory notes within the code to help developers understand it or document their logic. They do not affect code execution.
(2) Which of the following is the correct syntax for a single-line comment in JavaScript?
A) ``
B) `/* This is a comment */`
C) `// This is a comment`
D) `# This is a comment`
Answer: C) `// This is a comment`
Explanation: In JavaScript, `//` is used for single-line comments.
(3) How do you write a multi-line comment in JavaScript?
A) `/* This is a comment` `This is another comment */`
B) ``
C) `// This is a comment`
D) `# This is a comment`
Answer: A) `/* This is a comment` `This is another comment */`
Explanation: Multi-line comments in JavaScript are written between `/*` and `*/`.
(4) Which of the following comments will not work in JavaScript?
A) `// This is a comment`
B) ``
C) `/* This is a comment */`
D) `# This is a comment`
Answer: B) ``
Explanation: The `` syntax is used for comments in HTML, not JavaScript.
(5) What will happen if you forget to close a multi-line comment?
A) The comment will still be considered valid
B) The rest of the code will be commented out
C) The browser will throw an error
D) The comment will be ignored
Answer: B) The rest of the code will be commented out
Explanation: If a multi-line comment is not closed, the entire code following it will be treated as a comment, causing errors.
(6) What is the advantage of using comments in your code?
A) To improve the performance of the script
B) To make the code easier to understand for others
C) To make the code run faster
D) To hide the code from the user
Answer: B) To make the code easier to understand for others
Explanation: Comments help to document the code and make it easier for other developers (or yourself) to understand the logic and structure of the code.
(7) Which of the following is a valid comment in JavaScript?
A) `/* Comment /*`
B) ``
C) `// Comment`
D) `# Comment`
Answer: C) `// Comment`
Explanation: `//` is used to create single-line comments in JavaScript.
(8) How would you comment out the following line of code in JavaScript?
`let x = 10;`
A) `/* let x = 10; */`
B) ``
C) `# let x = 10;`
D) `// let x = 10;`
Answer: D) `// let x = 10;`
Explanation: `//` is used to comment out a single line of code in JavaScript.
(9) How do comments in JavaScript affect the execution of the code?
A) They cause the program to stop execution
B) They have no effect on code execution
C) They are executed as code
D) They slow down code execution
Answer: B) They have no effect on code execution
Explanation: Comments are ignored by JavaScript and do not affect the execution of the code in any way.
(10) What is the correct way to add a comment at the beginning of your JavaScript file?
A) ``
B) `// This is a comment`
C) `/* This is a comment */`
D) Any of the above
Answer: D) Any of the above
Explanation: Any of these comment formats can be used at the beginning of a file to provide documentation. `//` and `/* */` are valid ways to add comments.
(Chap # 45 - Events: Links)
(1) What is an event in JavaScript?
A) A function that is executed at a specific time
B) A built-in JavaScript function
C) A user interaction or a system-generated occurrence that can trigger a response
D) A loop that runs continuously
Answer: C) A user interaction or a system-generated occurrence that can trigger a response
Explanation: An event in JavaScript is any action or occurrence that can trigger a response, such as a mouse click or keyboard press.
(2) How can you attach an event to a link element in JavaScript?
A) Using the `onclick` attribute in the HTML tag
B) By adding an event listener to the element
C) Both A and B
D) Using the `addEventListener` method in the JavaScript code
Answer: C) Both A and B
Explanation: You can attach events to a link element by using the `onclick` attribute in the HTML tag or by using `addEventListener` in the JavaScript code.
(3) Which event is triggered when a user clicks a link in JavaScript?
A) `onload`
B) `onclick`
C) `onmouseover`
D) `onchange`
Answer: B) `onclick`
Explanation: The `onclick` event is triggered when a user clicks on a link or any other clickable element.
(4) How can you prevent a link from following its href when it is clicked?
A) Using the `preventDefault()` method
B) Returning `false` in the click event handler
C) Using `return false` in the `onclick` function
D) All of the above
Answer: D) All of the above
Explanation: You can prevent a link from following its `href` by using the `preventDefault()` method or by returning `false` in the event handler.
(5) Which method is used to attach an event to an element in JavaScript?
A) `attachEvent()`
B) `addEventListener()`
C) `bindEvent()`
D) `onEvent()`
Answer: B) `addEventListener()`
Explanation: `addEventListener()` is used to attach an event to an element in modern JavaScript.
(6) How do you define a link in HTML that triggers a JavaScript function on click?
A) href="javascript:void(0)"onclick="myFunction()"
B) href="myFunction()"
C) href="javascript:myFunction()"
D) onclick="myFunction()"
Explanation: To trigger a JavaScript function on click without navigating to another page, use `href="javascript:void(0)"` and define the `onclick` handler.
(7) What does the `this` keyword refer to in the context of a link event handler?
A) The event object
B) The link element that was clicked
C) The global object
D) The function itself
Answer: B) The link element that was clicked
Explanation: In an event handler, `this` refers to the element that triggered the event—in this case, the link that was clicked.
(8) Which of the following is the correct syntax for preventing the default action of a link?
A) `event.stopPropagation()`
B) `event.preventDefault()`
C) `event.cancelDefault()`
D) `event.preventAction()`
Answer: B) `event.preventDefault()`
Explanation: `event.preventDefault()` is used to prevent the default behavior of a link, such as navigating to the URL specified in the `href` attribute.
(9) What does the `this.href` property represent in a link event handler?
A) The event object
B) The URL that the link points to
C) The name of the link element
D) The text content of the link
Answer: B) The URL that the link points to
Explanation: `this.href` gives access to the URL specified in the `href` attribute of the link element that triggered the event.
(10) How can you create a link that opens a new window when clicked?
A) href="url" target="new"
B) href="url" target="_blank"
C) href="url"
onclick="window.open()"
D) Both B and C
Answer: D) Both B and C
Explanation: Both methods can be used to open a new window. Using `target="_blank"` in the `href` attribute or calling `window.open()` in the `onclick` event handler.
(Chap # 46 - Events : buttons)
(1) Which event is typically used to handle a button click in JavaScript?
A) `onload`
B) `onchange`
C) `onclick`
D) `onmouseover`
Answer: C) `onclick`
Explanation: The `onclick` event is used to handle a click on a button element in JavaScript.
(2) How can you attach an event handler to a button using JavaScript?
A) By using the `addEventListener()` method
B) By setting the `onclick` property of the button
C) Both A and B
D) By using the `onClick` attribute in the HTML tag
Answer: C) Both A and B
Explanation: You can attach an event handler to a button by using either `addEventListener()` or setting the `onclick` property.
(3) What happens when the `this` keyword is used inside a button click event handler?
A) It refers to the event object
B) It refers to the button element that was clicked
C) It refers to the global object
D) It refers to the function itself
Answer: B) It refers to the button element that was clicked
Explanation: Inside an event handler, `this` refers to the element that triggered the event—in this case, the button.
(4) How can you change the text of a button using JavaScript?
A) `button.innerText = "New Text"`
B) `button.textContent = "New Text"`
C) `button.innerHTML = "New Text"`
D) All of the above
Answer: D) All of the above
Explanation: You can change the text of a button using `innerText`, `textContent`, or `innerHTML`.
(5) What is the correct syntax for adding a click event handler to a button with the ID `myButton`?
A) `myButton.onclick = function() { alert("Button clicked!"); }`
B) `document.getElementById("myButton").onclick = function() { alert("Button clicked!"); }`
C) `document.getElementById("myButton").addEventListener("click", function() { alert("Button clicked!"); })`
D) All of the above
Answer: D) All of the above
Explanation: All of these methods are valid ways to attach a click event handler to a button in JavaScript.
(6) What does the `return false;` statement do in an event handler?
A) It prevents the default action associated with the event
B) It prevents the event from bubbling up the DOM
C) It stops the event from being triggered
D) Both A and B
Answer: D) Both A and B
Explanation: `return false;` in an event handler prevents the default action and stops the event from propagating further in the DOM.
(7) How can you disable a button in JavaScript?
A) `button.disabled = true;`
B) `button.setAttribute("disabled", "true");`
C) Both A and B
D) `button.setDisabled(true);`
Answer: C) Both A and B
Explanation: You can disable a button by setting `button.disabled = true` or by using `setAttribute("disabled", "true")`.
(8) Which of the following is the correct way to enable a button using JavaScript?
A) `button.disabled = false;`
B) `button.setAttribute("disabled", "false");`
C) `button.removeAttribute("disabled");`
D) Both A and C
Answer: D) Both A and C
Explanation: You can enable a button by either setting `button.disabled = false` or removing the `disabled` attribute using `removeAttribute("disabled")`.
(9) What is the default behavior of a button when clicked?
A) It triggers the `submit` action
B) It does nothing
C) It triggers a `click` event
D) It triggers an `onclick` event handler
Answer: A) It triggers the `submit` action
Explanation: If the button is inside a form, the default action when clicked is to submit the form. Otherwise, it triggers the `click` event.
(10) How can you change the background color of a button when clicked?
A) `button.style.backgroundColor = "red";`
B) `button.style.background = "red";`
C) `button.bgColor = "red";`
D) `button.setAttribute("style", "background-color: red;");`
Answer: A) `button.style.backgroundColor = "red";`
Explanation: You can change the background color of a button by modifying the `style.backgroundColor` property in JavaScript.
(Chap # 47 - Events Mouse)
1. What does the `click` event do in JavaScript?
A) It triggers when a user clicks anywhere on the screen.
B) It triggers when the mouse button is pressed.
C) It triggers when a user clicks on a specific element.
D) It triggers when the mouse hovers over an element.
Answer: C) It triggers when a user clicks on a specific element.
The `click` event is triggered when a user clicks on an element, such as a button or link.
---
2. Which of the following is true about the `mousedown` event?
A) It fires when the mouse button is pressed down.
B) It fires when the mouse button is released.
C) It fires when the mouse moves.
D) It fires when a key is pressed.
Answer: A) It fires when the mouse button is pressed down.
The `mousedown` event is triggered when the mouse button is pressed, before it is released.
---
3. Which of the following events is triggered when a mouse pointer moves over an element?
A) `mouseover`
B) `mouseout`
C) `mousemove`
D) `mouseenter`
Answer: A) `mouseover`
The `mouseover` event is triggered when the mouse pointer enters an element.
---
4. What does the `mouseup` event do in JavaScript?
A) It triggers when the mouse button is clicked.
B) It triggers when the mouse button is released after being pressed.
C) It triggers when the mouse moves.
D) It triggers when the mouse enters an element.
Answer: B) It triggers when the mouse button is released after being pressed.
The `mouseup` event occurs when the mouse button is released after being pressed.
---
5. Which event is used to detect the mouse movement on the entire page?
A) `mousemove`
B) `mouseover`
C) `mouseout`
D) `mouseenter`
Answer: A) `mousemove`
The `mousemove` event is triggered whenever the mouse pointer moves within the page or element.
---
6. Which of the following events is triggered when the mouse leaves an element?
A) `mouseout`
B) `mouseover`
C) `mouseup`
D) `mousemove`
Answer: A) `mouseout`
The `mouseout` event is triggered when the mouse pointer leaves an element.
---
7. How can you prevent the default action of a mouse event, such as opening a link when clicked?
A) `event.preventDefault()`
B) `event.stopPropagation()`
C) `event.preventAction()`
D) `event.stopDefault()`
Answer: A) `event.preventDefault()`
The `event.preventDefault()` method prevents the default action associated with the event, such as opening a link when clicked.
---
8. Which method can be used to attach a mouse event handler to an element in JavaScript?
A) `element.addEventListener()`
B) `element.attachEvent()`
C) `element.onClick()`
D) `element.mouseEvent()`
Answer: A) `element.addEventListener()`
The `addEventListener()` method is used to attach event handlers to elements in JavaScript.
---
9. What is the purpose of the `mouseenter` event?
A) It fires when the mouse pointer moves inside an element.
B) It fires when the mouse enters an element.
C) It fires when the mouse leaves an element.
D) It fires when the mouse button is clicked.
Answer: B) It fires when the mouse enters an element.
The `mouseenter` event is triggered when the mouse pointer enters the boundary of an element.
---
10. Which of the following events can be used to detect when a user double-clicks on an element?
A) `dblclick`
B) `click`
C) `mousedown`
D) `mouseup`
Answer: A) `dblclick`
The `dblclick` event is triggered when a user double-clicks on an element.
(Chap # 48 - Events: fields)
(1) What is the purpose of the "onchange" event in form fields?
A) To trigger an event when the page is loaded
B) To trigger an event when the user clicks a button
C) To trigger an event when the value of an input field changes
D) To trigger an event when the mouse hovers over an element
Answer: C) To trigger an event when the value of an input field changes
Explanation: The "onchange" event is fired when the value of an input field changes, typically after the user leaves the input field.
(2) Which HTML element can be used to trigger an event on field focus?
A) input
B) button
C) div
D) form
Answer: A) input
Explanation: The element can trigger events like "onfocus" and "onblur" when the user interacts with the field.
(3) What does the "onfocus" event in JavaScript do?
A) It triggers when the user clicks on an element
B) It triggers when the user hovers over an element
C) It triggers when an input field gains focus
D) It triggers when an input field loses focus
Answer: C) It triggers when an input field gains focus
Explanation: The "onfocus" event is triggered when an input element receives focus, typically when the user clicks or tabs into the field.
(4) What does the "onblur" event do?
A) It is triggered when an input field loses focus
B) It is triggered when the form is submitted
C) It is triggered when an input field gains focus
D) It is triggered when a button is clicked
Answer: A) It is triggered when an input field loses focus
Explanation: The "onblur" event is triggered when an input field loses focus, typically when the user clicks away from the field.
(5) How can you access the value of an input field using JavaScript?
A) document.getElementById("inputID").value
B) document.getElementById("inputID").innerHTML
C) document.getElementById("inputID").text
D) document.getElementById("inputID").textContent
Answer: A) document.getElementById("inputID").value
Explanation: You can use the "value" property to access the current value of an input field.
(6) What is the default event associated with a "submit" button in a form?
A) "onclick"
B) "onsubmit"
C) "onfocus"
D) "onchange"
Answer: B) "onsubmit"
Explanation: The "onsubmit" event is triggered when a form is submitted.
(7) Which of the following JavaScript methods is used to trigger an event programmatically on an element?
A) triggerEvent()
B) dispatchEvent()
C) runEvent()
D) executeEvent()
Answer: B) dispatchEvent()
Explanation: The "dispatchEvent()" method is used to trigger an event programmatically on an element.
(8) Which of the following events is triggered when a user types in an input field?
A) "onchange"
B) "onkeydown"
C) "onkeypress"
D) "onkeyup"
Answer: C) "onkeypress"
Explanation: The "onkeypress" event is triggered when a key is pressed down while the input field is focused.
(9) How do you stop an event from propagating in JavaScript?
A) event.stopPropagation()
B) event.preventDefault()
C) event.preventEvent()
D) event.stopEvent()
Answer: A) event.stopPropagation()
Explanation: The "stopPropagation()" method is used to stop the event from propagating up or down the DOM tree.
(10) What will the "onchange" event do for a text input field?
A) Trigger when the input field loses focus
B) Trigger when the input field gains focus
C) Trigger when the user types in the input field
D) Trigger when the value of the input field changes
Answer: D) Trigger when the value of the input field changes
Explanation: The "onchange" event is triggered when the value of the input field changes, typically after the user moves out of the field.
(Chap # 49 - Reading field values)
(1) How can you get the value of an input field in JavaScript?
A) document.getElementById("inputID").value
B) document.getElementById("inputID").text
C) document.getElementById("inputID").innerHTML
D) document.getElementById("inputID").content
Answer: A) document.getElementById("inputID").value
Explanation: The "value" property is used to access the current value of an input field in JavaScript.
(2) What is the correct way to get the value of a text input field?
A) document.getElementById("inputID").getValue()
B) document.getElementById("inputID").value()
C) document.getElementById("inputID").value
D) document.getElementById("inputID").getValue
Answer: C) document.getElementById("inputID").value
Explanation: To access the value of an input field, use the "value" property.
(3) Which JavaScript event is often used to get the value of an input field after the user finishes typing?
A) "onfocus"
B) "onchange"
C) "onclick"
D) "onblur"
Answer: B) "onchange"
Explanation: The "onchange" event is fired when the user changes the value of an input field and moves the focus away from it.
(4) How can you retrieve the value of a checkbox input in JavaScript?
A) document.getElementById("checkboxID").checked
B) document.getElementById("checkboxID").value
C) document.getElementById("checkboxID").text
D) document.getElementById("checkboxID").content
Answer: A) document.getElementById("checkboxID").checked
Explanation: To get the state of a checkbox (checked or unchecked), use the "checked" property.
(5) How can you retrieve the value of a radio button group in JavaScript?
A) document.getElementsByName("radioName").value
B) document.getElementById("radioName").checked
C) document.querySelector("input[type='radio']").value
D) document.getElementsByName("radioName").checked
Answer: A) document.getElementsByName("radioName").value
Explanation: Use the "value" property of the selected radio button from the group identified by its name.
(6) What is the value of a text field after a user has typed in a new value?
A) The value is automatically updated in the HTML
B) The value is updated in the DOM
C) The value remains unchanged until the page is refreshed
D) The value is reset every time the user clicks on it
Answer: B) The value is updated in the DOM
Explanation: When a user types in a text input field, the value is updated dynamically in the DOM, and can be accessed using JavaScript.
(7) What does the "innerHTML" property return?
A) The value of an input field
B) The text inside an element
C) The ID of an element
D) The class name of an element
Answer: B) The text inside an element
Explanation: The "innerHTML" property returns the HTML content (including text and HTML tags) of an element.
(8) How can you access the value of a select dropdown in JavaScript?
A) document.getElementById("dropdownID").value
B) document.getElementById("dropdownID").selected
C) document.getElementsByName("dropdownID").selectedIndex
D) document.querySelector("select").value
Answer: A) document.getElementById("dropdownID").value
Explanation: The "value" property returns the selected option's value from the dropdown.
(9) How can you get the value of an input field immediately after the user types it?
A) Using the "oninput" event
B) Using the "onchange" event
C) Using the "onclick" event
D) Using the "onkeyup" event
Answer: A) Using the "oninput" event
Explanation: The "oninput" event fires every time the user types in an input field, immediately updating the value.
(10) What does the "value" property of an input element return?
A) The default value of the input element
B) The current value entered by the user
C) The name of the input element
D) The type of the input element
Answer: B) The current value entered by the user
Explanation: The "value" property returns the current value of the input element that the user has entered.
(Chap # 50 - setting field values)
(1) How do you set the value of a text input field using JavaScript?
A) document.getElementById("inputID").setValue("new value")
B) document.getElementById("inputID").value = "new value"
C) document.getElementById("inputID").text = "new value"
D) document.getElementById("inputID").innerHTML = "new value"
Answer: B) document.getElementById("inputID").value = "new value"
Explanation: The value property is used to set the value of an input field in JavaScript.
(2) Which of the following is the correct way to set the value of a radio button group?
A) document.getElementsByName("radioGroupName").checked = true
B) document.getElementsByName("radioGroupName").value = "value"
C) document.getElementsByName("radioGroupName")[0].checked = true
D) document.getElementsByName("radioGroupName").setValue("value")
Answer: C) document.getElementsByName("radioGroupName")[0].checked = true
Explanation: To set the value of a radio button, you can select the button by its name and set the "checked" property to true.
(3) How can you change the value of a checkbox using JavaScript?
A) document.getElementById("checkboxID").checked = true
B) document.getElementById("checkboxID").checked = false
C) document.getElementById("checkboxID").value = true
D) Both A and B
Answer: D) Both A and B
Explanation: To change the state of a checkbox, you can either set the "checked" property to true or false.
(4) How do you set the value of a dropdown select element using JavaScript?
A) document.getElementById("selectID").value = "optionValue"
B) document.getElementById("selectID").setValue("optionValue")
C) document.getElementById("selectID").selectedIndex = "optionValue"
D) document.getElementById("selectID").selectValue = "optionValue"
Answer: A) document.getElementById("selectID").value = "optionValue"
Explanation: You can set the selected value of a dropdown by assigning a value to the "value" property of the select element.
(5) What is the method used to set the value of a text area field in JavaScript?
A) document.getElementById("textareaID").value = "new text"
B) document.getElementById("textareaID").setText("new text")
C) document.getElementById("textareaID").innerHTML = "new text"
D) document.getElementById("textareaID").text = "new text"
Answer: A) document.getElementById("textareaID").value = "new text"
Explanation: The "value" property is used to set the text of a text area field in JavaScript.
(6) How can you set the text of a paragraph element in JavaScript?
A) document.getElementById("paragraphID").innerHTML = "new text"
B) document.getElementById("paragraphID").value = "new text"
C) document.getElementById("paragraphID").textContent = "new text"
D) Both A and C
Answer: D) Both A and C
Explanation: You can use either "innerHTML" or "textContent" to set the text content of a paragraph element in JavaScript.
(7) Which property is used to change the value of an input field dynamically?
A) document.getElementById("inputID").text
B) document.getElementById("inputID").value
C) document.getElementById("inputID").content
D) document.getElementById("inputID").innerHTML
Answer: B) document.getElementById("inputID").value
Explanation: The "value" property is used to dynamically set the value of an input field in JavaScript.
(8) What will happen if you try to set a radio button's value that is not part of the radio group?
A) The value will be set successfully.
B) The radio button will be unselected.
C) The radio button will automatically be checked.
D) It will throw an error.
Answer: B) The radio button will be unselected.
Explanation: If a value is set for a radio button that is not part of the radio group, it will remain unselected.
(9) What is the correct way to set the text of a div element in JavaScript?
A) document.getElementById("divID").innerText = "new text"
B) document.getElementById("divID").textContent = "new text"
C) document.getElementById("divID").innerHTML = "new text"
D) All of the above
Answer: D) All of the above
Explanation: You can use "innerText," "textContent," or "innerHTML" to set the text of a div element, but "textContent" is the most standard for text manipulation.
(10) How can you set the value of a number input field in JavaScript?
A) document.getElementById("numberID").value = 10
B) document.getElementById("numberID").setValue(10)
C) document.getElementById("numberID").innerHTML = 10
D) document.getElementById("numberID").setText(10)
Answer: A) document.getElementById("numberID").value = 10
Explanation: Use the "value" property to set the value of a number input field.