DOM Element Object & JS Scope

Question 1

.appendChild()

.replaceChild()

.removeChild()

Answer 1

methods to add/replace/remove children nodes to an element

Question 2

.innerHTML

.innerText

.textContent

Answer 2

element.innerHTML //sets or returns the content of an element
//will process HTML use carefully

element.innerText //the text content without text spacing and tags, except script and style elements

element.textContent //sets or returns only textual content of a node

Question 3

.id

.className

.tagName

.classList

Answer 3

.id //sets or returns the element id

.className //sets or returns the element class

.tagName // read-only returns the tag name

.classList // returns a list of the element’s class names

Question 4

.focus()

.blur()

Answer 4

element.focus() //gives focus to an element
document.getElementById(“id”).focus();

element.blur() //removes focus from an element

Question 5

element.nodeName

element.nodeType

element.nodeValue

Answer 5

.nodeName // returns the name of a node header, etc.

.nodeType // returns the type of a node

.nodeValue // sets or returns the value of a node (text between tags)

Question 6

element.style

Answer 6

sets or returns style attribute of an element
element.style.attribute = “”;

Question 7

element.remove()

Answer 7

removes the element from the DOM

Question 8

element.setAttribute();

element.removeAttribute();

Answer 8

//sets / changes the attribute for an element
element.setAttribute(“class”, “demo”);

element.removeAttribute(“href”);

Question 9

element.appendChild(“li”);

Answer 9

appends a child element

Question 10

element.click();

Answer 10

performs a click event on the element

Question 11

element.title

Answer 11

sets or returns the value of the title attribute

Question 12

What are the three possible scopes of variables?

Answer 12

Block
Function | Local
Global

Question 13

Block Scope

Answer 13

variables declared inside a { } block
that cannot be accessed outside of it
{
let x = 2;
}

instantiated with let or const
a nested block can access the variable if it comes after.

introduced in ES6

Question 14

Local Scope

Answer 14

Variables declared within a JavaScript function, become LOCAL to the function.

function name() {
let myName = ‘Joe’;
}
only exists within the function

Local variables are created when a function starts, and deleted when the function is completed.

Question 15

Function Scope

Answer 15

JavaScript has function scope: Each function creates a new scope.

Variables defined inside a function are not accessible (visible) from outside the function.

Variables declared with var, let and const are quite similar when declared inside a function. As they’ll all have function scope.

Question 16

Global Scope

Answer 16

Global variables can be accessed from anywhere in a JavaScript program.

DOM collections also have global scope

Window object has global scope

Assigned variables that are not declared have global scope

function name() {
carName = ‘Volvo’; //global scope
}

Question 17

Why are global variables dangerous?

Answer 17

Your global variables (or functions) can overwrite window variables (or functions).
Any function, including the window object, can overwrite your global variables and functions.

Global variables can bleed out of conditional (if) blocks.

Question 18

What values are falsy?

Answer 18

false,
zero: 0, 0.0, 0x0, -0, 0n
(string.length === 0): “” `` ‘’
null
undefined
NaN

Objects are falsy if and only if they have the [[IsHTMLDDA]] internal slot, only document.all has this.

Question 19

What values are truthy?

Answer 19

true,
existing objects: ({}), ([]), (new Date())
non-zero numbers: 42, -2, Infinity, 12n
(string.length > 0): “0”, “text”, “false”