Flashcards: Javascript, HTTP and the DOM

What is the DOM?
The W3C Document Object Model (DOM) is a platform and language-neutral interface.
1/19

Terms

Definitions

What is the DOM? The W3C Document Object Model (DOM) is a platform and language-neutral interface.
The DOM is separated into three different levels, what are they? 1. Core DOM - standard model for any structured document
2. XML DOM - standard model for XML documents
3. HTML DOM - standard model for HTML documents
What does the DOM do? The DOM defines the objects and properties of all document elements, and the methods (interface) to access them.

..in other words; it allows programs and scripts to dynamically access and update the content, structure, and style of a document
How is the DOM structured?
The Dom is structured as a series of nodes laid out like a family tree:
Describe the relationships between the nodes in a DOM tree The top node is called the root, it has no parent.
Every other node has exactly one parent node,
A node can have any number of children,
Siblings are nodes with the same parent,
A leaf is a node with no children.
How would you represent the following code as a set of nodes in the DOM tree?
<p title="a gentle reminder">Don't forget to buy this stuff.</p>
From the following html, show what would represent the first and last child of each element
<html>
<head>
<title>DOM Tutorial</title>
</head>
<body>
<h1>DOM Lesson one</h1>
<p>Hello world!</p>
</body>
</html>
The <head> element is the first child of the <html> element, and the <body> element is the last child of the <html> element.

The <h1> element is the first child of the <body> element, and the <p> element is the last child of the <body> element
Summarize the concept of "graceful degradationn and how it is implemented.When a technology degrades gracefully, the functionality may be reduced, but it doesn't fail completely.
Design the functionality of a site to work across all browsers then add pretty/ useful extras for the more modern browsers.
ie: sidebar navigation with
<ul><li></li>
<ul><li></li></ul>
<li></li></ul>
structure will display as nested html but javascript can make the child <ul><li> hide/ unhide on mouseover to save space and look less cluttered
Browsers without JavaScript support will tend to show it as page content. How would you hide scripting code from a browser that doesn't support javascript? place a html comment tag around the JavaScript elements inside the <script> tag:
<html>
<body>
<script type="text/javascript">
<!--
document.getElementById("demo").innerHTML=Date();
//-->
</script>
</body>
</html>
( "//" stops the javascript from trying to execute "-->")
What are the syntax rules for naming a variable in JavaScript? 1. No mathematical, logical operators and punctuation marks (except the underscore) in the name
2. Names cannot start with a number or contain spaces, they must start with a letter or underscore.
3. Reserved keywords/ function names cannot be used as variable names (they can be used as part of a name though ie: my_window or guitarString)
Name 4 important syntax rules in JavaScript 1. JavaScript is case sensitive
2. White space is ignored
3. Statements must end with a semicolon
4. Reserved words and function names are lower case
Describe how to add scripts to an (X)HTML page.1. Place each individual piece of JavaScript inside the head tags:
<head><title>Example</title>
<script>JavaScript goes here...</script>
</head>

2. Have all your JavaScript in an external file and point to it using the src attribute:
<head><title>Example</title>
<script src="file.js"></script>
</head>

3. Same as above but place at the end of the body tags:
<body>
divs and stuff here..
<script src="file.js"></script>
</body>
Why might it be better to place the <script> between the <body> tags rather than in the <head> tags?Scripts in the <head> block the browser's ability to download additional files (such as images or other scripts) in parallel.

The HTTP specification suggests that browsers download no more than two items at the same time per hostname. However, while a script's downloading the browser won't start any other downloads (even on different hostnames) so everything waits for the script to finish. Placing it at the very end of the <body> tag ensures everything needed is in place before the script runs.
Name 5 common http methods1. GET: Send named resource from the server to the client.
2. PUT: Store data from client into a named server resource.
3. DELETE: Delete the named resource from a server.
4. POST: Send client data into a server gateway application.
5. HEAD: Send just the HTTP headers from the response for the named resource.
Name the two types of http messages request and response
A http message consists of three parts, what are they? 1.start line
2. header fields
3. body
what does the http start line consist of The first line of the message is the start line, indicating what to do for a request or what happened for a response.
(ie: GET /beads.html HTTP/1.0 )
what do the http header fields consist ofZero or more header fields follow the start line. Each header field consists of a name and a value, separated by a colon (:) for easy parsing. The headers end with a blank line. Adding a header field is as easy as adding another line.
(ie: User-agent: Mozilla/4.75 [en] (Win98; U)
Host: rosevibe.me.uk
Accept: text/html, image/gif, image/jpeg
Accept-language: en)
what does a http body consist of? Request bodies carry data to the web server; response bodies carry data back to the client.

The body can contain arbitrary binary data (e.g., images, videos, audio tracks, software applications). Of course, the body can also contain text.