Brainscape's Knowledge GenomeTM

Browse over 1 million classes created by top students, professors, publishers, and experts.


See full index

Web Development > DOM > Flashcards

DOM Flashcards

1
Q

What does document.querySelectorAll() take as its argument and what does it return?

A

takes a css selector and returns a node list

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

What does document.querySelector() take as its argument and what does it return?

A

takes a css selector and returns a single node

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

Why would a tag need to be placed at the bottom of the HTML content instead of at the top?

A

so that everything else could load first

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

What console method allows you to inspect the properties of a DOM element object?

A

console.dir()

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

Why might you want to assign the return value of a DOM query to a variable?

A

you use it frequently

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

What is the word “object” referring to in the phrase Document Object Model?

A

objects are what comprise the web page

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

Which “document” is being referred to in the phrase Document Object Model?

A

document node

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

What is a DOM Tree?

A

dom element with its components it consists of four nodes: document node, element nodes, attribute nodes, and text nodes

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

Why do we log things to the console?

A

we log things to the console to know what we are doing and to check that our work is valid

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

Which “document” is being referred to in the phrase Document Object Model?

A

html

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

What is a “model”?

A

representation of something

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

Why do we log things to the console?

A

we log things to the console to know what we are doing and to check that our work is valid

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

What is the purpose of events and event handling?

A

user interactivity

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

Are all possible parameters required to use a JavaScript method or function?

A

no

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

What method of element objects lets you set up a function to be called when a specific type of event occurs?

A

.addEventListener()

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

What object is passed into an event listener callback when the event fires?

A

event object; all of the data that a browser feels is pertinent to that event

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

What is the event.target? If you weren’t sure, how would you check? Where could you get more information about it?

A

the target property of the event interface is a reference to the object onto which the event was dispatched

check on mdn

basically, which object was the event acted upon?

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

What is the difference between these two snippets of code?

element. addEventListener(‘click’, handleClick)
element. addEventListener(‘click’, handleClick())

A

the first is using a callback function while the second is immediately calling the function

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

What is the className property of element objects?

A

the className property gets and sets the value of the class attribute of the specified element

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

How do you update the CSS class attribute of an element using JavaScript?

A

use the className property

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

What is the textContent property of element objects?

A

it is whatever text is written for the object

22
Q

What is the textContent property of element objects?

A

text inside of the element

23
Q

Is the event parameter of an event listener callback always useful?

A

it is not always useful

24
Q

Would this assignment be simpler or more complicated if we didn’t use a variable to keep track of the number of clicks?

A

it would be more complicated because we would have to

25
Q

Why is storing information about a program in variables better than only storing it in the DOM?

A

you don’t have to keep searching for the information in the dom

26
Q

What event is fired when a user places their cursor in a form control?

A

focus

27
Q

What event is fired when a user’s cursor leaves a form control?

A

blur

28
Q

What event is fired as a user changes the value of a form control?

A

input

29
Q

What event is fired when a user clicks the “submit” button within a ?

A

submit

30
Q

What does the event.preventDefault() method do?

A

if the event does not get explicitly handled, its default action should not be taken as it normally would be

31
Q

What does submitting a form without event.preventDefault() do?

A

it refreshes the page immediately

32
Q

What property of a form element object contains all of the form’s controls.

A

element

33
Q

What property of form a control object gets and sets its value?

A

value

34
Q

What is one risk of writing a lot of code without checking to see if it works so far?

A

one part of the code may be broken and it would be a hassle to track through all the code to find what is broken

35
Q

What is an advantage of having your console open when writing a JavaScript program?

A

you can immediately detect when there is an error message

36
Q

Does the document.createElement() method insert a new element into the page?

A

no

37
Q

How do you add an element as a child to another element?

A

appendChild()

38
Q

What do you pass as the arguments to the element.setAttribute() method?

A

name, value

39
Q

What steps do you need to take in order to insert a new element into the page?

A

query document, create element, append element

40
Q

What is the textContent property of an element object for?

A

see the text content

41
Q

Name two ways to set the class attribute of a DOM element.

A

className and setAttribute

42
Q

What are two advantages of defining a function to do create something (like the work of creating a DOM tree)?

A

reusability, no need to create another function in a different area so more control

43
Q

Give two examples of media features that you can query in an @media rule

A

placeholder

44
Q

Which HTML meta tag is used in mobile-responsive web pages?

A

placeholder

45
Q

What is the event.target?

A

this is the element to which the event happened to

46
Q

Why is it possible to listen for events on one element that actually happen to its descendent elements?

A

bubbling

47
Q

What DOM element property tells you what type of element it is?

A

element.target.nodeName

tagName

48
Q

What does the element.closest() method take as its argument and what does it return?

A

this traverses the element and its parent until it finds a node that matches the provided selector string and it will return itself or the matching ancestor; if no such element exists, it returns null

49
Q

How can you remove an element from the DOM?

A

use .remove() method

50
Q

If you wanted to insert new clickable DOM elements into the page using JavaScript, how could you avoid adding an event listener to every new element individually?

A

parent element

Web Development (14 decks)

Brainscape helps you reach your goals faster, through stronger study habits.
© 2024 Bold Learning Solutions. Terms and Conditions