Modern Web Design with HTML5, CSS3, and JavaScript - Updating and Applying the Element Manipulation Styles Using JavaScr

This video tutorial demonstrates how to use JavaScript to select and style HTML elements. It covers selecting elements by ID and class, applying styles such as text alignment, color, background color, and font weight. The tutorial emphasizes using JavaScript to manipulate the style attributes of elements, providing examples of changing text alignment, color, and adding borders. The lesson concludes with a challenge to highlight elements with a specific class, applying a yellow background and bold font weight.

What is the first step in applying styles to an HTML element using JavaScript?

• Use a loop to iterate over all elements

• Select the element using a query selector

• Create a new HTML element

• Write CSS styles in a separate file

Which method is used to select an element by its ID in JavaScript?

• document.querySelectorAll

• document.getElementByTagName

• document.querySelector

• document.getElementByClassName

How can you change the text color of an element using JavaScript?

• By setting the innerHTML property

• By changing the textContent property

• By modifying the class attribute

• By using the style.color property

What is the correct way to set a background color using JavaScript?

• element.style.backgroundColor = 'yellow'

• element.style.setBackground = 'yellow'

• element.background = 'yellow'

• element.setStyle('background', 'yellow')

Which of the following is a valid way to set a border using JavaScript?

• element.border = '5px solid red'

• element.setBorder('5px solid red')

• element.style.setBorder = '5px solid red'

• element.style.border = '5px solid red'

What is the purpose of using a loop when applying styles to elements with a specific class?

• To change the class name of elements

• To create new elements

• To apply styles to each element individually

• To delete elements from the DOM

Which method is used to select all elements with a specific class in JavaScript?

• document.querySelectorAll

• document.getElementsByClassName

• document.querySelector

• document.getElementById