Brainscape's Knowledge GenomeTM

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


See full index

Web Development > HTML > Flashcards

HTML Flashcards

1
Q

Where do you put non-visible content about the HTML document?

A

head

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

Where do you put visible content about the HTML document?

A

body

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

Where do theheadandbodytags go in a valid HTML document?

A

between the html tags

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

What is the purpose of adeclaration?

A

declare to the web browser the type of HTML that’s being used

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

Give five examples of HTML element types.

A

h1, p, img, a, span

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

What is the purpose of HTML attributes?

A

additional values that configure the elements or adjust their behavior

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

Give an example of an HTML entity (escape character).

A 
& = ampersand
© = copyright symbol
® = registered trademark symbol
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
8
Q

How do block-level elements affect the document flow?

A

block-level elements always appear on a new line

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

How do inline elements affect the document flow?

A

inline elements continue on the same line as neighboring elements

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

What are the default width and height of a block-level element?

A

width = 100%, height = auto

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

What are the default width and height of an inline element?

A

width = auto, height = auto

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

What is the difference between an ordered list and an unordered list in HTML?

A

Ordered lists use numbers, unordered lists use bullets

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

Is an HTML list a block element or an inline element?

A

block element

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

What HTML tag is used to link to another website?

A

anchor tag <a></a>

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

What is an absolute URL?

A

the full web address for the site

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

What is a relative URL?

A

URL that only includes the path

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

How do you indicate the relative link to a parent directory?

A

../filename

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

How do you indicate the relative link to a child directory?

A

child folder/filename

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

How do you indicate the relative link to a grand parent directory?

A

../../filename

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

How do you indicate the relative link to the same directory?

A

filename

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

What is the purpose of an HTMLformelement?

A

group all form control elements, collect user input

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

Give five examples of form control elements.

A

text input, password input, text area, checkbox, radio button

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

Give three examples oftypeattribute values for HTMLinput elements.

A

text, radio, checkbox

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

Is an HTML inputelement a block element or an inline element?

A

inline

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

What are the six primary HTML elements for creating tables?

A

table, thead, tbody, tr, th, td

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

What purpose do thetheadandtbodyelements serve?

A

to specify each part of the table (head, body, footer)

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

Give two examples of data that would lend itself well to being displayed in a table.

A

listing a person and their age, day of the week and activity

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

What are the names of the individual pieces of a CSS rule?

A

selector, declaration block, property, value

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

In CSS, how do you select elements by theirclassattribute?

A

.

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

In CSS, how do you select elements by their type?

A

name of element

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

In CSS, how do you select an element by itsidattribute?

A

#

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

Name three different types of values you can use to specify colors in CSS.

A

name, hexcode, rgb

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

What CSS properties make up the box model?

A

border, margin, padding

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

Which CSS property pushes boxes away from each other?

A

margin

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

Which CSS property add space between a box’s content and its border?

A

padding

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

What is a pseudo-class?

A

a keyword added to a selector that defines a special state of a selected element

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

What are CSS pseudo-classes useful for?

A

styling elements in relation to external factors, :visited :checked :hover

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

Name three types of units that can be used to adjustfont-sizein CSS.

A

px, %, rem

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

What CSS property controls the font used for the text inside an element?

A

font-family

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

What is the defaultflex-directionof aflexcontainer?

A

row

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

What is the defaultflex-wrapof aflexcontainer?

A

nowrap (all items will be in one line)

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

How do you center items in a container horizontally and vertically?

A

justify-content: center horizontally

align-items: center vertically

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

Why do two div elements “vertically stack” on one another by default?

A

divs are block elements by default

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

What is the defaultflex-directionof an element withdisplay: flex?

A

row

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

What is thedefaultvalue for thepositionproperty of HTML elements?

A

position: static

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

How does settingposition: relativeon an element affect document flow?

A

it does not affect the position of surrounding elements

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

How does settingposition: relativeon an element affect where it appears on the page?

A

it moves an element in relation to where it would have been in normal flow

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

How does settingposition: absoluteon an element affect document flow?

A

it is taken out of document flow and no longer affects the position of other elements

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

How does settingposition: absoluteon an element affect where it appears on the page?

A

it moves an element in relation to its container

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

How do you constrain an absolutely positioned element to a containing block?

A

make that element position: relative

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

What are the four box offset properties?

A

top, bottom, left, right

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

What is the purpose of variables?

A

a location to store data for the future

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

How do you declare a variable?

A

var + name of variable = value;

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

How do you initialize (assign a value to) a variable?

A

=

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

What characters are allowed in variable names?

A

letters, numbers, dollar sign, underscore

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

What does it mean to say that variable names are “case sensitive”?

A

different casing for variables are unique

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

What is the purpose of a string?

A

to store text

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

What is the purpose of a number?

A

for representing mathematical values

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

What is the purpose of a boolean?

A

to represent a choice of yes or no( true or false)

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

What does the = operator mean in JavaScript?

A

for assigning values

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

How do you update the value of a variable?

A

assign the variable another value

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

What is the difference between null and undefined?

A

null is when something is intentionally set to an empty value, undefined is when something has not been assigned a value

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

Why is it a good habit to include “labels” when you log values to the browser console?

A

easier to identify what the values mean

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

Give five examples of JavaScript primitives.

A

string number boolean undefined null

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

What data type is returned by an arithmetic operation?

A

number

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

What is string concatenation?

A

combine two strings into one string

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

What purpose(s) does the + plus operator serve in JavaScript?

A

addition of numbers and concatenation of strings

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

What data type is returned by comparing two values (, ===, etc)?

A

boolean

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

What does the += “plus-equals” operator do?

A

i += 1 equates to i = i + 1;

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

What are objects used for?

A

grouping together a set of variables/functions to create a model

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

What are object properties?

A

a variable that’s a part of an object

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

Describe object literal notation.

A 
var object = {
property1: value,
property2: value,
property3: value
};
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
73
Q

How do you remove a property from an object?

A

delete object.property;

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

What are the two ways to get or update the value of a property?

A

dot notation and bracket notation

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

What are arrays used for?

A

to store a collection of data in an orderly fashion

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

Describe array literal notation.

A

var arr = [ ];

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

How are arrays different from “plain” objects?

A

objects have no order, objects have properties associated with their values

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

What number represents the first index of an array?

A

0

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

What is the length property of an array?

A

how many pieces of data are stored in the array

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

How do you calculate the last index of an array?

A

array.length - 1

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

What is a function in JavaScript?

A

repeatable named block of code that does a specific job

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

Describe the parts of a function definition.

A

function keyword, optional function name, set of parenthesis, parameter, curly braces for code block, code block with likely a return statement

83
Q

Describe the parts of a function call.

A

function name, parenthesis, arguments

84
Q

When comparing them side-by-side, what are the differences between a function call and a function definition?

A 
function definition will include a function keyword, code block, parameter
function call will include parenthesis, argument
85
Q

What is the difference between a parameter and an argument?

A

Parameters are properties of a function. Arguments are properties of a specific call to a function

86
Q

Why are function parameters useful?

A

allows us to pass information or instructions into functions

87
Q

What two effects does a return statement have on the behavior of a function?

A

return value replaces a function call

stops the function entirely

88
Q

Why do we log things to the console?

A

to check values while debugging applications

89
Q

What is a method?

A

a property of an object that contains a function definition

90
Q

How is a method different from any other function?

A

a method has to be called on an object

91
Q

How do you remove the last element from an array?

A

array.pop();

92
Q

How do you round a number down to the nearest integer?

A

Math.floor();

93
Q

How do you generate a random number?

A

Math.random();

94
Q

How do you delete an element from an array?

A

splice removes at certain index
pop removes at end
shift removes at beginning

95
Q

How do you append an element to an array?

A

push adds to end of array

unshift adds to beginning of array

96
Q

How do you break a string up into an array?

A

split();

97
Q

Do string methods change the original string? How would you check if you weren’t sure?

A

No, you can check with console.log before and after the string method

98
Q

Give 6 examples of comparison operators.

A

==, ===, , >=

99
Q

What data type do comparison expressions evaluate to?

A

boolean

100
Q

What is the purpose of an if statement?

A

to run a block of code if a condition is met

101
Q

Is else required in order to use an if statement?

A

no

102
Q

Describe the syntax (structure) of an if statement.

A

if (conditional statement) {
return x;
}

103
Q

What are the three logical operators?

A

|| (OR), && (AND), ! (NOT)

104
Q

How do you compare two different expressions in the same condition?

A

using || &&

105
Q

What is the purpose of a loop?

A

allow you to repeat a process over and over

106
Q

What is the purpose of a condition expression in a loop?

A

the stop point for the loop

107
Q

What does “iteration” mean in the context of loops?

A

a single run of a loop’s code block

108
Q

When does the condition expression of a while loop get evaluated?

A

before the iteration

109
Q

When does the initialization expression of a for loop get evaluated?

A

the first action before the loop begins, only once

110
Q

When does the condition expression of a for loop get evaluated?

A

before each iteration

111
Q

When does the final expression of a for loop get evaluated?

A

after each iteration

112
Q

Besides a return statement, which exits its entire function block, which keyword exits a loop before its condition expression evaluates to false?

A

break- just exits a loop

113
Q

How do you iterate through the keys of an object?

A

for in loop

114
Q

What are the four components of “the Cascade”.

A

source order
specificity
importance
inheritance

115
Q

What does the term “source order” mean with respect to CSS?

A

the rule that comes last in the css will win

116
Q

How is it possible for the styles of an element to be applied to its children as well without an additional CSS rule?

A

inheritance

117
Q

List the three selector types in order of increasing specificity.

A

elements
class/pseudo-class
id

118
Q

Why is using !important considered bad practice?

A

it makes debugging more difficult by breaking the natural cascade of stylesheets

119
Q

Why do we log things to the console?

A

to check the value of something in code

120
Q

What is a “model”?

A

a representation of something

121
Q

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

A

the HTML document

122
Q

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

A

javascript objects that manipulate the output

123
Q

What is a DOM Tree?

A

a tree with each branch ending in a node, which contains objects

124
Q

Give two examples of document methods that retrieve a single element from the DOM.

A

querySelector()

getElementById()

125
Q

Give one example of a document method that retrieves multiple elements from the DOM at once.

A

querySelectorAll()
getElementsByClassName()
getElementsByTagName()

126
Q

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

A

so u can directly access and store the information without using a DOM method every time

127
Q

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

A

console.dir()

128
Q

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

A

the browser needs to go through all the elements of the page first in order for JavaScript code to be able to access them

129
Q

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

A

argument: a selector
return: an element object representing the first element that matches the selector

130
Q

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

A

argument: a selector
return: NodeList containing all Element Objects that match the selector

131
Q

What is the purpose of events and event handling?

A

events are actions that the user does, event handling allows us to respond to user interactions

132
Q

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

A

no

133
Q

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

A

addEventListener()

134
Q

What is a callback function?

A

a function that is being passed as the argument of another function

135
Q

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

A

the event object, with all the data about the event that just occurred

136
Q

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

A

target property of event object which stores a dom element with the start point of this event

137
Q

What is the difference between these two snippets of code?

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

A

first snippet calls handleClick function when element is clicked
second snipper calls handleClick function immediately, which returns undefined value as an argument of addEventListener

138
Q

What is the className property of element objects?

A

gets and sets the value of the class attribute of element objects

139
Q

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

A

element.className = ‘new-class-attribute’;

140
Q

What is the textContent property of element objects?

A

gets and sets the text content of the element object

141
Q

How do you update the text within an element using JavaScript?

A

element.textContent = ‘new text content’;

142
Q

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

A

no

143
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

more complicated

144
Q

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

A

so you can access the information directly without calling dom object methods

145
Q

What does the transform property do?

A

lets you modify the coordinate space of an element

146
Q

Give four examples of CSS transform functions.

A

rotate, translate, scale, matrix

147
Q

What are the four transition properties?

A

property duration, timing-function, property

148
Q

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

A

focus

149
Q

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

A

blur

150
Q

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

A

input

151
Q

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

A

submit

152
Q

What does the event.preventDefault() method do?

A

prevents default behavior for an event

153
Q

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

A

it will automatically reload the page as the default

154
Q

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

A

elements

155
Q

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

A

value

156
Q

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

A

no, it creates a dom element that is not yet appended to the dom tree

157
Q

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

A

appendChild(element);

158
Q

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

A

arguments (name, value)

159
Q

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

A

create an element, then give it content, then add it to the dom

createElement(), createTextNode(), appendChild()

160
Q

What is the textContent property of an element object for?

A

to get and set text content of an element

161
Q

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

A

className();

setAttribute();

162
Q

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

A

automation and debugging

163
Q

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

A

min-width, max-width

164
Q

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

A

viewport meta tag

165
Q

What is the event.target?

A

html element where the event originated from

166
Q

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

A

event flow, specifically event bubbling

167
Q

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

A

tagName property

168
Q

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

A

argument: css selector
return: closest ancestor element

169
Q

How can you remove an element from the DOM?

A

remove method

170
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

add event listener to the parent, then verify tagName is correct

171
Q

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

A

argument: css selector
return: true if element matches a selector, or false if not

172
Q

How can you retrieve the value of an element’s attribute?

A

getAttribute method

173
Q

What is a breakpoint in responsive Web design?

A

the point at which a media query is introduced

174
Q

What is the advantage of using a percentage (e.g. 50%) width instead of a fixed (e.g. px) width for a “column” class in a responsive layout?

A

allows the column to adapt to the viewport size

175
Q

What is JSON?

A

text-based data format following JavaScript object syntax

176
Q

What are serialization and deserialization?

A

Serialization is the process of turning an object in memory into a stream of bytes so you can do stuff like store it on disk or send it over the network.

Deserialization is the reverse process: turning a stream of bytes into an object in memory.

177
Q

Why are serialization and deserialization useful?

A

convert objects to strings and strings to objects, to make data easily transmissible

178
Q

How do you serialize a data structure into a JSON string using JavaScript?

A

JSON.stringify( );

179
Q

How do you deserialize a JSON string into a data structure using JavaScript?

A

JSON.parse( JSON string );

180
Q

How do you store data in localStorage?

A

localStorage.setItem(keyName, keyValue);

181
Q

How do you retrieve data from localStorage?

A

localStorage.getData(keyName);

182
Q

What data type can localStorage save in the browser?

A

string data

183
Q

When does the ‘beforeunload’ event fire on the window object?

A

when the window is about to be unloaded

184
Q

What is a method?

A

a function that is a property of an object

185
Q

How can you tell the difference between a method definition and a method call?

A

method definition has function keyword and function code block, whereas method call only has name of the method with parentheses

186
Q

What are the four “principles” of Object-Oriented Programming?

A

Abstraction, Encapsulation, Inheritance, Polymorphism

187
Q

What is “abstraction”?

A

being able to work on complex things in simple ways

188
Q

What does API stand for?

A

Application Programming Interface

189
Q

What is the purpose of an API?

A

to give programmers a way to interact with a system abstractly, ie DOM API

190
Q

What is this in JavaScript?

A

this is an implicit parameter of all functions whose value is the object this method was called from. It only receives value when a function is actually called, there is no value for this within a function definition

191
Q

What does it mean to say that this is an “implicit parameter”?

A

this is available in a function’s code block even though it was never included as function parameter or declared with var

192
Q

When is the value of this determined in a function; call time or definition time?

A

call time

193
Q

What kind of inheritance does the JavaScript programming language use?

A

prototype-based

194
Q

What is a prototype in JavaScript?

A

an object that contains properties and methods that can be used by other objects

195
Q

How is it possible to call methods on strings, arrays, and numbers even though those methods don’t actually exist on strings, arrays, and numbers?

A

they delegate methods to their prototype object

196
Q

If an object does not have it’s own property or method by a given key, where does JavaScript look for it?

A

it looks at the object’s prototype object

197
Q

What does the new operator do?

A

it creates an instance of one of the built in object types with that constructor function

198
Q

What property of JavaScript functions can store shared behavior for instances created with new?

A

prototype property

199
Q

What does the instanceof operator do?

A

it returns boolean of whether constructor.prototype is found in a certain object

200
Q

Besides adding an event listener callback function to an element or the document, what is one way to delay the execution of a JavaScript function until some point in the future?

A

setTimeout()

201
Q

How can you set up a function to be called repeatedly without using a loop?

A

setInterval()

202
Q

What is the default time delay if you omit the delay parameter from setTimeout() or setInterval()?

A

defaults to 0

203
Q

What do setTimeout() and setInterval() return?

A

unique ID’s

Web Development (3 decks)

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