DOM Manipulation Questions and Answers

START LEARNING

#1. What does DOM stand for?

Document Operation Model

Data Operation Method

Data Object Model

Document Object Model

#2. Which method is used to select an element by its id in JavaScript?

getElementsByTagName()

querySelector()

getElementByClassName()

getElementById()

#3. How can you change the text inside an HTML element using JavaScript?

element.textContent = "New Text";

element.innerHTML = "New Text";

element.innerText = "New Text";

All of the above

#4. Which method is used to create a new HTML element?

document.newElement()

document.addElement()

document.createElement()

document.appendChild()

#5. How do you add a class to an HTML element?

element.add('classname');

element.classList.add('classname');

element.className('classname');

element.addClass('classname');

#6. What does innerHTML represent?

The entire document structure

The text inside an element

The HTML content inside an element

The value of an input field

#7. How do you remove an element from the DOM?

element.remove();

element.removeChild();

element.detach();

element.delete();

#8. Which method is used to add a child element to a parent element?

insertChild()

appendChild()

createChild()

addChild()

#9. How can you select all elements with the class example?

None of the above

document.querySelectorAll('.example')

Both 1 and 2

document.getElementsByClassName('example')

#10. What is the difference between textContent and innerHTML?

textContent returns raw text, while innerHTML includes HTML tags

innerHTML returns raw text, while textContent includes HTML tags

Both return the same content

textContent is faster than innerHTML

#11. Which method can be used to find the parent element of a node?

parentNode

getParentNode()

findParent()

getParent()

#12. Which event is triggered when a user clicks on an element?

onchange

onclick

onkeypress

onmouseover

#13. How can you add multiple classes to an element?

None of the above

element.setClasses('class1 class2');

element.classList.add('class1', 'class2');

element.addClass('class1, class2');

#14. What does document.querySelectorAll() return?

A NodeList of all matching elements

A single element

An array of all matching elements

None of the above

#15. What is the purpose of the setAttribute() method?

To remove an attribute

To add an event listener

To set the value of an attribute

To replace an element

#16. Which property is used to get or set the value of a form input element?

innerHTML

value

textContent

className

#17. Which of the following methods inserts content as the last child of a parent?

append()

appendChild()

Both 1 and 2

insertAfter()

#18. What does children return when used on an element?

Child text nodes

Direct child elements only

All sibling elements

All descendant elements

#19. Which method can be used to clone an HTML element?

element.clone()

element.cloneElement()

element.copy()

element.cloneNode()

#20. What is the correct syntax to add an event listener in JavaScript?

element.bindEvent('click', function);

element.on('click', function);

element.attachEvent('click', function);

element.addEventListener('click', function);

#21. Which property gets the first child of an element?

children[0]

getFirstChild()

firstElementChild

firstChild

#22. What does nextSibling return?

Undefined

The next element sibling

The next node sibling (including text and comments)

The last child node

#23. What is the difference between appendChild and append?

append works with NodeList

appendChild is faster

append supports adding multiple elements and text nodes

Both are the same

#24. How can you prevent an event’s default behavior?

event.stopDefault();

event.preventDefault();

event.cancel();

event.stopPropagation();

#25. Which method removes a specific attribute from an element?

removeAttr()

deleteAttribute()

removeProp()

removeAttribute()

#26. How can you check if an element has a specific class?

element.hasClass('classname')

element.classList.contains('classname')

element.isClass('classname')

element.checkClass('classname')

#27. What does lastElementChild return?

The last child element

None of the above

The first child element

All child elements

#28. Which method inserts a node before another node?

insertAfter()

insertBefore()

appendBefore()

prepend()

#29. What happens if you try to access a non-existent DOM element with getElementById()?

Returns null

Returns undefined

Throws an error

Returns an empty string

#30. What is the output of element.children.length?

Total number of attributes in the element

Total number of child nodes

Total number of child elements

Total number of sibling elements

#31. Which method adds text to the DOM?

document.createText('text')

document.createTextNode('text')

document.appendText('text')

document.addTextNode('text')

#32. What does the contains() method do?

Checks if a parent contains all child elements

Checks if an element has specific text

Checks if a class is applied to an element

Checks if a node contains another node

#33. How do you replace one element with another in the DOM?

replaceNode(newNode, oldNode)

swapElement(newNode, oldNode)

replaceElement(newNode, oldNode)

replaceChild(newNode, oldNode)

#34. Which event is triggered when the DOM is fully loaded

onready

loadComplete

DOMContentLoaded

onload

#35. What is the difference between stopPropagation and preventDefault?

Both prevent default behavior

None of the above

stopPropagation stops event bubbling, while preventDefault prevents default behavior

Both stop event bubbling

#36. What does the focus() method do?

Highlights the element

Sets focus on a specific element

Changes the CSS of the element

Deletes other elements

#37. How do you remove all child elements from a parent element?

parent.empty();

parent.clearChildren();

parent.removeAllChildren();

Use while(parent.firstChild) { parent.removeChild(parent.firstChild); }

#38. How can you access the style property of an element in JavaScript?

element.style

element.styles

element.css

element.getStyle()

#39. Which property gives the width of an element, including padding but excluding borders?

outerWidth

clientWidth

offsetWidth

scrollWidth

#40. Which method adds a node as the first child of a parent element?

appendChild()

insertBefore()

addFirstChild()

prepend()

Finish

Results

Congratulations !

Opps! Try Again

For More Information Visit : – India gk

Contact for website Design and development – Chaturbhuja Sons

Menus 📃

Indian Insights 📖

Important QA (महत्वपूर्ण प्र. उ. )

Lifestyle and Entertainment (जीवनशैली और मनोरंजन)

CodeQuest 📖

Web Design

JavaScript & Frameworks

Programming Languages

Database & SQL (Coming soon)

SOCIAL SHARING 🖐

Welcome to CodeQuest

HTML, CSS & Bootstrap

JavaScript & Frameworks

Programming Languages

Database & SQL (Coming soon)

DOM Manipulation

There are Multiple Choice Questions

Correct answers color: Green

Wrong answers color: Red

#1. What does DOM stand for?

#2. Which method is used to select an element by its id in JavaScript?

#3. How can you change the text inside an HTML element using JavaScript?

#4. Which method is used to create a new HTML element?

#5. How do you add a class to an HTML element?

#6. What does innerHTML represent?

#7. How do you remove an element from the DOM?

#8. Which method is used to add a child element to a parent element?

#9. How can you select all elements with the class example?

#10. What is the difference between textContent and innerHTML?

#11. Which method can be used to find the parent element of a node?

#12. Which event is triggered when a user clicks on an element?

#13. How can you add multiple classes to an element?

#14. What does document.querySelectorAll() return?

#15. What is the purpose of the setAttribute() method?

#16. Which property is used to get or set the value of a form input element?

#17. Which of the following methods inserts content as the last child of a parent?

#18. What does children return when used on an element?

#19. Which method can be used to clone an HTML element?

#20. What is the correct syntax to add an event listener in JavaScript?

#21. Which property gets the first child of an element?

#22. What does nextSibling return?

#23. What is the difference between appendChild and append?

#24. How can you prevent an event’s default behavior?

#25. Which method removes a specific attribute from an element?

#26. How can you check if an element has a specific class?

#27. What does lastElementChild return?

#28. Which method inserts a node before another node?

#29. What happens if you try to access a non-existent DOM element with getElementById()?

#30. What is the output of element.children.length?

#31. Which method adds text to the DOM?

#32. What does the contains() method do?

#33. How do you replace one element with another in the DOM?

#34. Which event is triggered when the DOM is fully loaded

#35. What is the difference between stopPropagation and preventDefault?

#36. What does the focus() method do?

#37. How do you remove all child elements from a parent element?

#38. How can you access the style property of an element in JavaScript?

#39. Which property gives the width of an element, including padding but excluding borders?

#40. Which method adds a node as the first child of a parent element?

Results

Leave a Reply Cancel reply

Social Sharing