java 3

Question 1

document object model

Answer 1

gives you scripting access to all elements on a web page

Question 2

DOM defines:

Answer 2

• HTML5 elements as objects
• properties of all HTML elements
• methods to access all HTML elements
• events for all HTML elements

Question 3

what can Java do (simple)

Answer 3

create, modify, and remove elements in the page dynamically

Question 4

list of what java can do

Answer 4

• change all HTML elements in page
• change all HTML element attributes in page
• change all CSS styles in page
• remove existing/add new HTML elements and attributes
• react to all existing HTML elements on page

Question 5

the nodes in a document make up the page’s

Answer 5

DOM tree

Question 6

DOM tree describes

Answer 6

relationships among elements

Question 7

nodes are related to each other through

Answer 7

child-parent relationships

Question 8

t/f: a node can have multiple children and multiple parents

Answer 8

false
multiple children, only one parent

Question 9

nodes with same parent node are

Answer 9

siblings

Question 10

html node in dom tree is called

Answer 10

root node, which is parent node of all HTML elements in a page

Question 11

finding HTML elements in Java
(all document.)

Answer 11

getElementById, getElementsByTagName, getElementsByClassName

Question 12

return all p elements as an array inside myElement

Answer 12

var x = myElement.document.getElementsByTagName(“p”);

Question 13

return all elements with class=”major”

Answer 13

var x = document.getElementsByClassName(“major”);

Question 14

finding html elements by css selectors
- p elements with class intro

Answer 14

var x = document.querySelectorAll(“p.intro”);

Question 15

DOM has collections-

Answer 15

groups of related objects on a page

Question 16

DOM collections examples

Answer 16

document.links/document.anchors, document.images, and document.forms

Question 17

DOM collection’s length property specifies

Answer 17

the number of items in the collections

Question 18

document.images[1]

Answer 18

second image in page

Question 19

document.forms.length

Answer 19

number of forms in page

Question 20

what is used to access element’s attribute values

Answer 20

dot (.) operator

Question 21

use dot operator to access 3 different attributes (get element first)

Answer 21

var x = document.getElementById(‘myImage’);
x.src = ‘newpic.jpg’;
x.className=’allpics’;
x.id=’alternateimg’;

Question 22

how to get user input value in form input element called fullName

Answer 22

var x = document.forms[0];
var y = x.fullName.value;

Question 23

node properties

Answer 23

parentNode, childNodes[nodenumber], firstChild, lastChild, nextSibling, previousSibling

Question 24

t/f: a child/sibling node can be a whitespace

Answer 24

true

Question 25

use HTML DOM tree of objects (slide 12). get the body element, head element, and a element.

Answer 25

body: document.getElementsByTagName("h1")[0].parentNode head: document.getElementsByTagName("html")[0].firstChild a element document.getElementsByTagName("h1")[0].previousSibling

Question 26

4 ways to change HTML elements

Answer 26

.innerHTML, .attribute, .setAttribute, .style.property

Question 27

element.innerHTML = new html content

Answer 27

change the inner HTML of an element

Question 28

element.setAttribute(what are two inputs?)

Answer 28

(attribute, value)

Question 29

element.attribute = ?

Answer 29

new value

Question 30

before changing html elements, you must

Answer 30

get element by id

Question 31

adding and deleting elements (document.____(element))

Answer 31

createElement, removeChild, appendChild, replaceChild

Question 32

removechild, appendchild, and replace child are not

Answer 32

document methods. they can be used with any parent element object

Question 33

2 ways to add event handler, which is recommended

Answer 33

.addEventListener("click", myFunction, false); .onclick = myFunction(){} first is recommended