1.

How to import JavaScript to your const quotient = num1 / num2;

project?
a. <script> </script>
const resultElement =
b. <script src="script.js"></script> document.getElementById('result');
resultElement.innerHTML = `
2. Write a snippet of code to get the <p>Sum: ${sum}</p>
value of the input field with an id
<p>Difference: ${difference}</p>
"email".
<p>Product: ${product}</p>
const emailInput =
document.getElementById('email'); <p>Quotient: ${quotient}</p>
const emailValue = emailInput.value; `;
}
3. What is innerHTML and its usage?
Provide an example.
5. Write a function that accesses the
<div id="myDiv"> index of a string and displays it using
<p>.
<p>Hello, <span
id="name">John</span>!</p> function displayIndex(str) {
</div> const indexElement =
document.getElementById('index');
indexElement.innerHTML = `<p>Index
const nameElement =
of 'a': ${str.indexOf('a')}</p>`;
document.getElementById('name');
}
console.log(nameElement.innerHTML);
// Output: John
6. Write a function that loops through
all buttons with the class "btn" and
4. Write a function that will display
displays the text value of the buttons
the result of basic calculations like +
using the alert function.
- * / using <p>.
function displayButtonValues() {
function displayCalculation(num1,
num2) { const buttons =
document.getElementsByClassName('bt
const sum = num1 + num2;
n');
const difference = num1 - num2;
for (let i = 0; i < buttons.length; i++) {
const product = num1 * num2;
 const buttonText = const confirmPassword =
buttons[i].textContent; document.getElementById('confirmPass
word').value;
alert(buttonText);
}
if (firstName.trim() === '') {
}
alert('Please enter your first name.');
return false;
7. How do you call a JavaScript
function from your HTML tag? }
<button onclick="myFunction()">Click
me</button>
if (lastName.trim() === '') {
alert('Please enter your last name.');
8. Write a function that will validate
return false;
the information inputted by the user
with the following ids: }
First Name Last Name
Email if (email.trim() === '') {
Password alert('Please enter your email.');
Confirm Password return false;
Make sure that the password matches. }

function validateForm() { if (password.trim() === '') {

const firstName = alert('Please enter a password.');
document.getElementById('firstName').v
alue; return false;

const lastName = }
document.getElementById('lastName').v
alue;
if (confirmPassword.trim() === '') {
const email =
document.getElementById('email').value alert('Please confirm your
; password.');

const password = return false;

document.getElementById('password').v }
alue;
 onunload: Occurs when a web page is
unloaded or closed.
if (password !== confirmPassword) {
onfocus: Occurs when an element
alert('Passwords do not match.');
receives focus.
return false;
onblur: Occurs when an element loses
} focus.
onscroll: Occurs when the user scrolls
the content of an element.
// If all validations pass, submit the
form onresize: Occurs when the browser
window is resized.
return true;
onerror: Occurs when an error occurs
} while loading an external file (e.g.,
image).

9. List down all the HTML5 Events

and describe each. 10. What is the use of JavaScript for
onclick: Occurs when an element is your web project? Provide scenarios.
clicked.
ondblclick: Occurs when an element is ESSAY
double-clicked.
onmouseover: Occurs when the mouse
pointer is moved over an element.
onmouseout: Occurs when the mouse
pointer is moved out of an element.
onkeydown: Occurs when a key is
pressed down.
onkeyup: Occurs when a key is
released.
onchange: Occurs when the value of an
element changes (e.g., input field,
dropdown).
onsubmit: Occurs when a form is
submitted.
onload: Occurs when a web page or an
image is finished loading.