Dom manipulation: forms and rich text Flashcards

1
Q

What are the best ways to retrieve a form element?

A

document.getElementById(“formID”);
or document.forms[“formName”];
Name can be different from ID (or you can use an index number)

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

What special mechanism does the DOM provide that allow us to access form elements (e.g. a textarea or a button or input)?

A
Use someForm.elements with an index or name to retrieve a form's elements (it won't include non-input like ul or label or legend, but it will include fieldsets and not the elements inside a fieldset).
var someInput = someForm.elements["input1"];
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
3
Q

What does the form elements collection return?

A

A node or an HTMLCollection, depending. If a form contains several radio buttons with name=”color”, then elements[“color”] will return a collection.

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

How can you disable a submit button so that the form can be submitted once but not again?

A

form.addEventListener(“submit”, handler); Handler will set button.disabled to true.
Don’t use the click event, since this could fire before the submission actually occurs. Don’t put listener on the button itself.

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

What is the default type for a button element in a form?

A

“submit”

For non-submit buttons, change the type to “button” manually.

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

How can you get the text content in a text field or input field?

A

Use textbox.value to get and set. Don’t use textbox.getAttribute() or textbox.firstChild.nodeValue;

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

How can you ensure that the first element in a form gets automatically focused using HTML?

A

add autofocus to the HTML form element (just the word, no true or false).

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

What are the HTML5 alternate input types?

A

type=”email”, type=”url”, type=”search”, type=”tel”, type=”number” plus a number of date and time types. Note mixed browser support.

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

What are two html5 ways you could create an input field that allowed only multiples of 5 between 0 and 100?

A

/input type=”number” min=”0” max=”100” step=”5” name=”count”/ or
/input type=”range” min=”0” max=”100” step=”5”/
First lets you click up or down; second is a slider

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

What is an html5 way to validate that a form has a required input in which text must be either cat or dog.

A

use required and pattern keywords: input type=”text” required pattern=”cat|dog”

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

How can you make any old element editable?

A

set contentEditable to true. This can be done in HTML or javascript:
someDIv.contentEditable = true;

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

What are the two complex types of JSON syntax?

A

Object and Array. Array is simply: [ { “prop”: “value” } , …

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

What is JSON stringify() method and how does it work?

A

JSON.stringify(someNonJSONObject); This will serialize the object into proper JSON syntax;

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

What is JSON parse() method?

A

JSON.parse(someJSON) will turn the JSON into a javascript object.

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

How can you turn only certain specified properties of an object into JSON?

A

Use the filter argument of stringify, which is an array of properties to serialize: e.g. JSON.stringify(myObj, [“prop1”, “prop2”])

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