Mid Term study DOM

Question 1

How to create an element node?

Answer 1

document.createElement(elementName)

Example:
let link = document.createElement(“a”);
link.href = “http://sheridancollege.ca”;

Question 2

How would you append the <a> tag below to the div then append it all to the body?:</a>

const a = document.createElement(“a”);
const div = document.createElement(“div”);

Answer 2

div.appendChild(a);
document.body.appendChild(div);

Question 3

innerHTML vs createTextNode() vs textContent

Which one to use? and why?

Answer 3

createTextNode(text) and textContent will escape any special characters, but innerHTML will not

innerHTML is less efficient because it forces the browser to re-parse or re-build the entire DOM tree every time it’s used

Therefore only use innerHTML if mandatory, opt to use createTextNode() or textContent.
Examples:
document.createTextNode(“Hello World”);

let p = document.createElement(“p”);
p.textContent = “Hello World”;

Question 4

How to delete a HTML div with an id of mydiv?

Answer 4

let div = document.querySelector(“#mydiv”)
div.remove();