JavaScript and the DOM Flashcards

(78 cards)

1
Q

What JavaScript function retrieves all elements with a specified tag name?

A

document.getElementsByTagName()

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
2
Q

What does document.getElementsByTagName() return?

A

A live HTMLCollection of all elements matching the tag name.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
3
Q

What does document.getElementById() return?

A

A single element matching the specified ID.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
4
Q

Example of using getElementsByTagName to count paragraphs

A

const paragraphs = document.getElementsByTagName("p"); console.log(paragraphs.length);

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
5
Q

What is the purpose of the <noscript> tag?</noscript>

A

To display alternative content if JavaScript is disabled or unsupported.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
6
Q

Where should <noscript> be placed?</noscript>

A

Inside the <body> element to provide fallback content.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
7
Q

Example of a <noscript> tag</noscript>

A

<noscript>JavaScript is disabled — please enable it for full functionality.</noscript>

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
8
Q

Why should scripts be placed at the bottom of an HTML page?

A

To allow HTML to load before scripts execute, improving load time.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
9
Q

Alternative to placing scripts at bottom of HTML

A

Use the defer attribute in the

 tag.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
10
Q

Example of using defer in script tag

A

<script src="app.js" defer></script>

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
11
Q

What is the proper way to access a form field named field1 inside a form named form1?

A

document.forms[“form1”].elements[“field1”]

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
12
Q

Why is document.field1 invalid?

A

It doesn’t specify the form hierarchy and will not find nested fields.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
13
Q

Example of accessing a form field value

A

let value = document.forms["form1"].elements["field1"].value;

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
14
Q

What is the integer value for TEXT_NODE in the DOM?

A

3

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
15
Q

Which DOM node type has value 1?

A

ELEMENT_NODE

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
16
Q

Which DOM node type has value 2?

A

ATTRIBUTE_NODE

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
17
Q

Which DOM node type has value 3?

A

TEXT_NODE

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
18
Q

Which DOM node type has value 8?

A

COMMENT_NODE

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
19
Q

Example of checking for TEXT_NODE in code

A

if (node.nodeType === 3) { console.log("This is a text node"); }

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
20
Q

Why is document.getElementsByTagName() preferred over getElementById() for tag-based selection?

A

Because it retrieves multiple elements rather than just one.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
21
Q

What kind of collection does getElementsByTagName() return?

A

A live HTMLCollection that updates if the DOM changes.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
22
Q

What does the <noscript> tag improve?</noscript>

A

Accessibility and user experience for browsers without JavaScript.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
23
Q

How can script placement affect performance?

A

Scripts at the top block rendering; placing them later improves perceived load speed.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
24
Q

How can you access a specific form in the DOM?

A

Use document.forms[index] or document.forms["formName"]

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
25
What does node.nodeType === 3 check for?
It checks whether a node is a TEXT_NODE.
26
What does appendChild() do?
It appends a created element to a specified parent element in the DOM.
27
Example of appendChild()
"Creates

Hello World!

and appends it: var newPara=document.createElement('p'); var newText=document.createTextNode('Hello World!'); newPara.appendChild(newText); document.body.appendChild(newPara);"
28
How are Arrays created in JavaScript?
By declaring elements in brackets [ ]. Example: const Beatles = ['Ringo','Paul','George','John'];
29
What indexing do JavaScript arrays use?
Zero-based indexing.
30
What does the Date() constructor return when called with no parameters?
The current local date and time.
31
How do you create a Date for January 17 2021 13:15:30?
"var newDate=new Date('2021-1-17 13:15:30');"
32
What does document.createElement() do?
Creates a new HTML element node of the specified tag name.
33
What does document.createTextNode() do?
Creates and returns a text node containing the supplied string.
34
What does document.getElementById() do?
Returns the element whose id matches the specified value.
35
What does document.getElementsByTagName() return?
A live NodeList of all elements with the specified tag name.
36
What does document.write() do?
Writes text or HTML to the document, overwriting existing content (used mainly for testing).
37
What does element.getAttribute(name) return?
The value of the specified attribute.
38
What does element.innerHTML represent?
The HTML markup contained within an element; can be read or set as a string.
39
What does element.removeAttribute(name) do?
Removes the specified attribute from the element.
40
What does element.setAttribute(name,value) do?
Sets or overwrites an attribute with the specified value.
41
How do you change an element’s inline CSS using JavaScript?
"Use element.style.propertyName=value; e.g., div1.style.color='red';"
42
What is an Error object in JavaScript?
An object describing runtime errors with properties such as name and message.
43
List six core JavaScript error types.
TypeError, RangeError, URIError, EvalError, ReferenceError, SyntaxError.
44
How do you throw a custom error?
Use throw new Error('message');
45
What is the History object?
Part of the window object; provides access to the browser session history.
46
How do you go back two pages using history?
history.go(-2);
47
What does insertBefore(newNode,existingNode) do?
Inserts a node before an existing child node.
48
What is the Location object?
Part of the window object providing information about the current URL (e.g., location.hostname).
49
What is the Navigator object?
Represents the client’s browser (user agent); properties vary by browser.
50
What does the onload event do?
Runs a function after the page or element has finished loading.
51
What does replaceChild(newNode,oldNode) do?
Replaces an existing child node with a new node.
52
What is the Screen object?
Represents the user’s screen and exposes properties such as screen.height and screen.width.
53
What is the Window object?
Top-level global object of the browser; represents the browser window.
54
What does window.open() do?
Opens a new browser window or tab with a specified URL and optional features.
55
Example of window.open()
"window.open('http://www.ibm.com','myWindow','width=600,height=800');"
56
What does window.scrollTo(x,y) do?
Scrolls the window to the coordinates (x,y).
57
What are Wrapper objects?
Object versions of primitive types allowing property/method access (e.g., new String('abc')).
58
What does typeof return for a primitive string vs. a String object?
'string' for 'abc'; 'object' for new String('abc').
59
Can JavaScript modify server files directly?
No, JavaScript runs client-side and cannot modify server files.
60
What are valid JavaScript output methods?
console.log, alerts/prompts, and modifying the DOM.
61
Why can a JavaScript function return different types?
Because JavaScript is dynamically typed and infers return types at runtime.
62
Which method retrieves an element by its ID?
document.getElementById("id")
63
What keyword declares a traditional JavaScript function?
function
64
What is the result of var total = 5 + 2 + "8"?
The string "78"
65
What DOM node type has integer value 3?
Text node
66
Which array method combines elements into a single value?
reduce()
67
How do you calculate the sum of an array?
`array.reduce((sum, val) => sum + val, 0)`
68
How do you add a property using prototypes?
Vehicle.prototype.color = "Blue"
69
How do you add a property in a constructor?
Add it inside the constructor function.
70
Which property changes text and formatting in a div?
innerHTML
71
What does innerHTML do?
Gets or sets the HTML content of an element.
72
What is the scope of a variable declared with let?
Block-level scope, limited to {}
73
How does var differ from let?
var is function-scoped; let is block-scoped.
74
What does reduce() return?
A single accumulated value from array elements.
75
What happens when you mix numbers and strings in addition?
Numbers are added first, then concatenated as strings.
76
What method is used to find elements by tag name?
document.getElementsByTagName("tag")
77
What node type represents an element?
1 (ELEMENT_NODE)
78
What node type represents a comment?
8 (COMMENT_NODE)