DOM scripting: web design with javascript and DOM

Three sheets to the Web

• Structure : describe the semantic meaning of content
• Presentation : describes how the content should be displayed
• Behavior : describes how the content should react to events

Web design discipline : Separation

• Use (X)HTML to structure your documents.
• Use CSS to attach presentational information.
• Use DOM scripting to apply behavioral instructions.

DOM

Tree: element node, attribute node, text node

• Every element in a document is an object, and every one of these objects has a whole collection of properties.
• Position property :
  
  • parentNode, nextSibling, previousSibling, childNodes, firstChild, and lastChild
• Identity property:　nodeType， nodeName
• Style property: (style property is an object)
  
  • /p/ id=”example” style=”color: grey; font-family: ‘Arial’,sans-serif;”> /p/