现在的位置: 首页 > 综合 > 正文

DOM study notes

2014年01月07日 ⁄ 综合 ⁄ 共 5790字 ⁄ 字号 评论关闭

Introduction

1.DOM level
Dom level 1

specified in 1998.
DOM level 2
includes Core Specification, Events Specification, Style Specification, Tranversal and Range Specification, View Specification (2000.11)
and also HTML Specification(2003.1)
DOM level 3 
includes
Validation Specification, Core Specification, Load and Save Specification (2004.4)
XPath Specification, View and Formatting Specification, Abstract Schemas Specification.

2.js's document source
protocol,host,port

3.DOM object in js
Windows object, the biggest object.
Screen,Navigaor,Location,History

4.document.frames[0]
document.frames[1]
return the frame of the Document.

5.<form name="f1"></form>
can be found by this "document.f1".

6.var newwin = window.oprn(...);
newwin.document.write(....);
document.anchors//get the anchor of the document.

DOM level 1 study
1.DOM is an application programming interface for HTML and XML document.(XML can also be treated as data, not document.)
we use OMG IDL as the specification of the DOM interfaces.

2.DOM 1 consist of two part, DOM core and DOM html.
The DOM Core represents the functionality used for XML documents, and also serves as the basis for DOM HTML.
A compliant implementation of the DOM must implement all of the fundamental interfaces in the Core chapter, and it must must implement at least one of the HTML DOM and the XML interface with the semantics as defined.

3.DOM interfaces
get/set
createXXX();

4.DOM level 1's left work
sructure model for internal subset and the external subset.
Validation against a schema
Control for rendering document via style sheets
Access control
Thread-safety
Events

DOM Core Level 1

1.types of nodes and the child they may have
Document -- Element (maximum of one), ProcessingInstruction, Comment, DocumentType
DocumentFragment -- Element, ProcessingInstruction, Comment, Text, CDATASection, EntityReference
DocumentType -- no children
EntityReference -- Element, ProcessingInstruction, Comment, Text, CDATASection, EntityReference
Element -- Element, Text, Comment, ProcessingInstruction, CDATASection, EntityReference
Attr -- Text, EntityReference
ProcessingInstruction -- no children
Comment -- no children
Text -- no children
CDATASection -- no children
Entity -- Element, ProcessingInstruction, Comment, Text, CDATASection, EntityReference
Notation -- no children
2.remove, removed and may be returned.
delete, removed and is not returned.
3.Interface of DOMImplementation
boolean hasFreature(in DOMS)

interfaces 

take "Document" and "Node" for example

Document:

interface Document : Node {
  readonly attribute  DocumentType         doctype;
  readonly attribute  DOMImplementation    implementation;
  readonly attribute  Element              documentElement;
  Element                   createElement(in DOMString tagName)
                                          raises(DOMException);
  DocumentFragment          createDocumentFragment();
  Text                      createTextNode(in DOMString data);
  Comment                   createComment(in DOMString data);
  CDATASection              createCDATASection(in DOMString data)
                                               raises(DOMException);
  ProcessingInstruction     createProcessingInstruction(in DOMString target, 
                                                        in DOMString data)
                                                        raises(DOMException);
  Attr                      createAttribute(in DOMString name)
                                            raises(DOMException);
  EntityReference           createEntityReference(in DOMString name)
                                                  raises(DOMException);
  NodeList                  getElementsByTagName(in DOMString tagname);
};

Node:

interface Node {
  // NodeType
  const unsigned short      ELEMENT_NODE       = 1;
  const unsigned short      ATTRIBUTE_NODE     = 2;
  const unsigned short      TEXT_NODE          = 3;
  const unsigned short      CDATA_SECTION_NODE = 4;
  const unsigned short      ENTITY_REFERENCE_NODE = 5;
  const unsigned short      ENTITY_NODE        = 6;
  const unsigned short      PROCESSING_INSTRUCTION_NODE = 7;
  const unsigned short      COMMENT_NODE       = 8;
  const unsigned short      DOCUMENT_NODE      = 9;
  const unsigned short      DOCUMENT_TYPE_NODE = 10;
  const unsigned short      DOCUMENT_FRAGMENT_NODE = 11;
  const unsigned short      NOTATION_NODE      = 12;

  readonly attribute  DOMString            nodeName;
           attribute  DOMString            nodeValue;
                                                 // raises(DOMException) on setting
                                                 // raises(DOMException) on retrieval
  readonly attribute  unsigned short       nodeType;
  readonly attribute  Node                 parentNode;
  readonly attribute  NodeList             childNodes;
  readonly attribute  Node                 firstChild;
  readonly attribute  Node                 lastChild;
  readonly attribute  Node                 previousSibling;
  readonly attribute  Node                 nextSibling;
  readonly attribute  NamedNodeMap         attributes;
  readonly attribute  Document             ownerDocument;
  Node                      insertBefore(in Node newChild, 
                                         in Node refChild)
                                         raises(DOMException);
  Node                      replaceChild(in Node newChild, 
                                         in Node oldChild)
                                         raises(DOMException);
  Node                      removeChild(in Node oldChild)
                                        raises(DOMException);
  Node                      appendChild(in Node newChild)
                                        raises(DOMException);
  boolean                   hasChildNodes();
  Node                      cloneNode(in boolean deep);
};

Document Object Model (HTML) Level 1

1.introduction

The key differences between the core DOM and the HTML application of DOM is that the HTML Document Object Model exposes a number of convenience methods and properties that are consistent with the existing models and are more appropriate to script writers.

2.What Included in HTML DOM
An HTMLDocument interface, derived from the core Document interface.
An HTMLElement interface, derived from the core Element interface.
Specializations for all HTML elements that have attributes that extend beyond those specified in the HTMLElement interface.

3.Interfaces
HTMLCollection
HTMLDocument
HTMLElement
HTMLHtmlElement (root of an HTML document)
HTMLHeadElement
HTMLLinkElement
HTMLTitleElement
HTMLMetaElement (This contains generic meta-information about the document)
HTMLBaseElement
HTMLIsIndexElement
HTMLStyleElement
HTMLBodyElement
HTMLFormElement
HTMLSelectElement
HTMLOptGroupElement
HTMLOptionElement
HTMLInputElement
HTMLTextAreaElement
HTMLButtonElement
HTMLLabelElement
HTMLFieldSetElement
HTMLLegendElement (Provides a caption for a FIELDSET grouping)
HTMLUListElement
HTMLOListElement
HTMLDListElement
HTMLDirectoryElement
HTMLMenuElement
HTMLLIElement
HTMLBlockquoteElement
HTMLDivElement (Generic block container)
HTMLParagraphElement
HTMLHeadingElement (For the H1 to H6 elements)
HTMLQuoteElement
HTMLPreElement
HTMLBRElement
HTMLBaseFontElement
HTMLFontElement
HTMLHRElement
HTMLModElement (Notice of modification to part of a document.)
HTMLAnchorElement
HTMLImageElement
HTMLObjectElement
HTMLParamElement
HTMLAppletElement
HTMLMapElement
HTMLAreaElement
HTMLScriptElement
HTMLTableElement
HTMLTableCaptionElement
HTMLTableColElement
HTMLTableSectionElement
HTMLTableRowElement
HTMLTableCellElement (The object used to represent the TH and TD elements.)
HTMLFrameSetElement (Create a grid of frames.)
HTMLFrameElement
HTMLIFrameElement

【上篇】
【下篇】

抱歉!评论已关闭.