alex_bn_lee

导航

【078】◀▶ HTML DOM

●·● 目录:

A0 ………… Core DOM

A1 ………… DOM Node 对象
A2 ………… DOM NodeList 对象
A3 ………… DOM NamedNodeMap 对象
A4 ………… DOM Document 对象
A5 ………… DOM Element 对象
A6 ………… DOM Attr 对象

   DOM 对象

G1 ………… DOM Document 对象
G2 ………… DOM Event 对象
G3 ………… DOM Element 对象
G4 ………… DOM Anchor 对象
G5 ………… DOM Area 对象
G6 ………… DOM Body 对象
G6 ………… DOM Button 对象

---------------------------------------------------------------------------------------------------------

            ╔════════╗
╠════╣    第A0个    ╠══════════════════════════════════════════════════╣
            ╚════════╝

●·● Core DOM

  通过 JavaScript,可以重构整个 HTML 文档,可以添加、移除、改变或重排页面上的项目。要改变页面的某个东西,JavaScript 就需要获得对 HTML 文档中所有元素进行访问的入口。这个入口,连同对 HTML 元素进行添加、移动、改变或移除的方法和属性,都是通过文档对象模型来获得的(DOM)。在 1998 年,W3C 发布了第一级的 DOM 规范。这个规范允许访问和操作 HTML 页面中的每一个单独的元素。DOM 可被 JavaScript 用来读取、改变 HTML、XHTML 以及 XML 文档。但 DOM 不是 JavaScript 专有的,事实上许多其他语言都实现了它。不过,Web 浏览器中的 DOM 已经用 ECMAScript 实现了,现在是 JavaScript 语言的一个很大组成部分。

  DOM 被分为不同的部分(核心、HTML及XML):

  1. Core DOM:定义了一套标准的针对任何结构化文档的对象。
  2. HTML DOM:定义了一套标准的针对 HTML 文档的对象。 学习HTML DOM。
  3. XML DOM:定义了一套标准的针对 XML 文档的对象。 学习XML DOM。

  DOM 有三个level(1/2/3):

  1. DOM Level 1 是 W3C 于 1998 年 10 月提出的。它由两个模块组成,即 DOM Core 和 DOM HTML。前者提供了基于 XML 的文档的结构图,以便访问和操作文档的任意部分;后者添加了一些 HTML 专用的对象和方法,从而扩展了 DOM Core。DOM Level 1 只是一个目标,即规划文档的结构。
  2. DOM Level 2 的目标非常广泛。对原始 DOM 的扩展添加了对鼠标和用户界面事件(DHTML 对此有丰富的支持)、范围、遍历(重复执行 DOM 文档的方法)的支持,并通过对象接口添加了对 CSS(层叠样式表)的支持。由 Level 1 引入的原始 DOM Core 也加入了对 XML 命名空间的支持。DOM Level 2 引入了几种 DOM 新模块,用于处理新的接口类型:
    1. DOM 视图 - 描述跟踪文档的各种视图(即 CSS 样式化之前和 CSS 样式化之后的文档)
    2. DOM 事件 - 描述事件的接口
    3. DOM 样式 - 描述处理基于 CSS 样式的接口
    4. DOM 遍历和范围 - 描述遍历和操作文档树的接口
  3. DOM Level 3 引入了以统一的方式载入和保持文档的方法(包含在新模块 DOM Load and Save)以及验证文档(DOM Validation)的方法,从而进一步扩展了 DOM。在 Level 3 中,DOM Core 被扩展为支持所有的 XML 1.0 特性,包括 XML Infoset、XPath 和 XML Base。

▷ 中文参考:http://blog.sina.com.cn/s/blog_61e439e5010167in.html

---------------------------------------------------------------------------------------------------------

            ╔════════╗
╠════╣    第A1个    ╠══════════════════════════════════════════════════╣
            ╚════════╝

●·● DOM Node 对象

▷ w3school (英):http://www.w3schools.com/jsref/dom_obj_node.asp

▷ 中文参考:http://blog.sina.com.cn/s/blog_61e439e5010167in.html

  节点对象代表文档树中的一个节点。Node 对象是整个 DOM 的主要数据类型。节点可以是文档节点、元素节点、属性节点、文本节点、注释节点等,详见后面的表格。

请注意,虽然所有的对象均能继承用于处理父节点和子节点的属性和方法,但是并不是所有的对象都拥有父节点或子节点。例如,文本节点不能拥有子节点,所以向类似的节点添加子节点就会导致 DOM 错误。

Node 对象属性描述DOM
attributes 返回元素属性的NamedNodeMap 1
baseURI 返回元素的绝对基准 URI 3
childNodes 返回元素的子节点的 NodeList 1
firstChild 返回节点的首个子节点。 1
lastChild 返回节点的最后一个子节点。 1
localName 返回节点的本地名称。 2
namespaceURI 返回元素的命名空间 URI 2
nextSibling 返回节点之后紧跟的同级节点。 1
nodeName 返回节点的名称,根据其类型。 1
nodeType 返回节点的类型。 1
nodeValue 设置或返回节点的值,根据其类型。 1
ownerDocument 返回节点的根元素(document 对象)。 2
parentNode 返回节点的父节点。 1
prefix 设置或返回节点的命名空间前缀。 2
previousSibling 返回节点之前紧跟的同级节点。 1
textContent 设置或返回节点及其后代的文本内容。 3

Node 对象方法描述DOM
append Child() 向节点的子节点列表的结尾添加新的子节点。 1
cloneNode() 复制节点。 1
compareDocumentPosition() 对比两个节点的文档位置。 1
getFeature(feature,version) 返回一个 DOM 对象,此对象可执行带有指定特性和版本的专门的 API。 3
getUserData(key) 返回与此节点上的某个键相关联的对象。此对象必须首先通过使用相同的键来调用 setUserData 被设置到此节点。 3
hasAttributes() 判断当前节点是否拥有属性。 2
hasChildNodes() 判断当前节点是否拥有子节点。 1
insertBefore() 在指定的子节点前插入新的子节点。 1
isDefaultNamespace() 返回指定的命名空间 URI 是否为默认。 3
isEqualNode() 检查两个节点是否相等。 3
isSameNode() 检查两个节点是否是相同的节点。 3
isSupported() 返回当前节点是否支持某个特性。 2
lookupNamespaceURI() 返回匹配指定前缀的命名空间 URI。 3
lookupPrefix() 返回匹配指定命名空间 URI 的前缀。 3
normalize() 合并相邻的Text节点并删除空的Text节点。 2
removeChild() 删除(并返回)当前节点的指定子节点。 1
replaceChild() 用新节点替换一个子节点。 1
setUserData(key,data,handler) 把对象关联到节点上的一个键上。 3

节点类型nodeType描述nodeName 返回值nodeValue 返回值子节点
1 Element 表示 element(元素)元素。 element name null Element, Text, Comment, ProcessingInstruction, CDATASection, EntityReference
2 Attr 表示属性。 属性名称 属性值 Text, EntityReference
3 Text 表示元素或属性中的文本内容。 #text 节点内容 None
4 CDATASection 表示文档中的 CDATA 区段(文本不会被解析器解析)。 #cdata-section 节点内容 None
5 EntityReference 表示实体引用元素。 实体引用名称 null Element, ProcessingInstruction, Comment, Text, CDATASection, EntityReference
6 Entity 表示实体。 实体名称 null Element, ProcessingInstruction, Comment, Text, CDATASection, EntityReference
7 ProcessingInstruction 表示处理指令。 target 节点的内容 None
8 Comment 表示注释。 #comment 注释文本 None
9 Document 表示整个文档(DOM 树的根节点)。 #document null Element, ProcessingInstruction, Comment, DocumentType
10 DocumentType 向为文档定义的实体提供接口。 doctype 名称 null None
11 DocumentFragment 表示轻量级的 Document 对象,其中容纳了一部分文档。 #document fragment null Element, ProcessingInstruction, Comment, Text, CDATASection, EntityReference
12 Notation 表示在 DTD 中声明的符号。 符号名称 null None

---------------------------------------------------------------------------------------------------------

            ╔════════╗
╠════╣    第A2个    ╠══════════════════════════════════════════════════╣
            ╚════════╝

●·● DOM NodeList 对象

▷ w3school (英):http://www.w3schools.com/jsref/dom_obj_nodelist.asp

▷ 中文参考:http://blog.sina.com.cn/s/blog_61e439e5010167in.html

NodeList 对象代表一个有顺序的节点列表。我们可通过节点列表中的节点索引号来访问列表中的节点(索引号由0开始)。节点列表可保持其自身的更新。如果节点列表或 XML 文档中的某个元素被删除或添加,列表也会被自动更新。
注释:在一个节点列表中,节点被返回的顺序与它们在 XML 被规定的顺序相同。

NodeList 对象属性描述DOM
length 返回节点列表中的节点数目。 1

NodeList 对象方法描述DOM
item() 返回节点列表中处于指定的索引号的节点。 1

---------------------------------------------------------------------------------------------------------

            ╔════════╗
╠════╣    第A3个    ╠══════════════════════════════════════════════════╣
            ╚════════╝

●·● DOM NamedNodeMap 对象

▷ w3school (英):http://www.w3schools.com/jsref/dom_obj_namednodemap.asp

▷ 中文参考:http://blog.sina.com.cn/s/blog_61e439e5010167in.html

NamedNodeMap 对象表示一个无顺序的节点列表。我们可通过节点名称来访问 NamedNodeMap 中的节点。NamedNodeMap 可保持其自身的更新。假如节点列表或 XML 文档中的某元素被删除或添加,节点也会被自动更新。
注释:在一个指定的节点地图中,节点不会以任何次序返回。
NamedNodeMap 对象属性描述DOM
length 返回列表中的节点数目 1

NamedNodeMap 对象方法描述DOM
getNamedItem() 返回指定的节点(通过名称) 1
getNamedItemNS() 返回指定的节点(通过名称和命名空间) 2
item() 返回处于指定索引号的节点 1
removeNamedItem() 删除指定的节点(根据名称)/td> 1
removeNamedItemNS() 删除指定的节点(根据名称和命名空间) 2
setNamedItem() 设置指定的节点(根据名称) 1
setNamedItemNS() 设置指定的节点(通过名称和命名空间) 2

---------------------------------------------------------------------------------------------------------

            ╔════════╗
╠════╣    第A4个    ╠══════════════════════════════════════════════════╣
            ╚════════╝

●·● DOM Document 对象

▷ w3school (英):http://www.w3schools.com/jsref/dom_obj_core_document.asp

▷ 中文参考:http://blog.sina.com.cn/s/blog_61e439e5010167in.html

Document 对象是一棵文档树的根,可为我们提供对文档数据的最初(或最顶层)的访问入口。用于元素节点、文本节点、注释、处理指令等均无法存在于 document 之外,document 对象同样提供了创建这些对象的方法。Node 对象提供了一个 ownerDocument 属性,此属性可把它们与在其中创建它们的 Document 关联起来。
Document 对象属性描述DOM
继承所有Node对象的属性
doctype 返回与文档相关的文档类型声明 (DTD)。 1
documentElement 返回文档的根节点 1
documentURI 设置或返回文档的位置 3
domConfig 返回normalizeDocument()被调用时所使用的配置 3
implementation 返回处理该文档的 DOMImplementation 对象。 1
inputEncoding 返回用于文档的编码方式(在解析时)。 3
strictErrorChecking 设置或返回是否强制进行错误检查。 3
xmlEncoding 返回文档的编码方法。 3
xmlStandalone 设置或返回文档是否为 standalone。 3
xmlVersion 设置或返回文档的 XML 版本。 3

Document 对象方法描述DOM
继承所有Node对象的方法
adoptNode(node) 从另一个文档向本文档选定一个节点,然后返回被选节点。 3
createAttribute() 创建拥有指定名称的属性节点,并返回新的 Attr 对象。 1
createAttributeNS(URI,name) 创建拥有指定名称和命名空间的属性节点,并返回新的 Attr 对象。 2
createCDATASection() 创建 CDATA 区段节点,仅适用于XML。 1
createComment() 创建注释节点。 1
createDocumentFragment() 创建空的 DocumentFragment 对象,并返回此对象。 1
create Element() 创建元素节点。 1
create ElementNS() 创建带有指定命名空间的元素节点。 2
createEntityReference() 创建 EntityReference 对象,并返回此对象,仅适用于XML。 1
createProcessingInstruction() 创建 ProcessingInstruction 对象,并返回此对象,仅适用于XML。 1
createTextNode() 创建文本节点。 1
getElementById() 查找具有指定的唯一 ID 的元素。 2
getElements ByTagName() 返回所有具有指定名称的元素节点。 1
getElementsByTagNameNS() 返回所有具有指定名称和命名空间的元素节点。 2
importNode() 把一个节点从另一个文档复制到该文档以便应用。 2
normalizeDocument() Removes empty Text nodes, and joins adjacent nodes 3
renameNode() 重命名指定的节点。 3

---------------------------------------------------------------------------------------------------------

            ╔════════╗
╠════╣    第A5个    ╠══════════════════════════════════════════════════╣
            ╚════════╝

●·● DOM Element 对象

▷ w3school (英):http://www.w3schools.com/jsref/dom_obj_element.asp

▷ 中文参考:http://blog.sina.com.cn/s/blog_61e439e5010167in.html

Element 对象表示的元素可包含属性、其他元素或文本。如果元素含有文本,则在文本节点中表示该文本。文本永远存储在文本节点中。在 DOM 处理过程中的一个常见的错误是,导航到元素节点,并认为此节点含有文本。不过,即使最简单的元素节点之下也拥有文本节点。举例,在 <year>2005</year> 中,有一个元素节点(year),同时此节点之下存在一个文本节点,其中含有文本(2005)。
Element 对象属性描述DOM
继承所有Node对象的属性
schemaTypeInfo 返回与元素相关联的类型信息 3
tagName 返回元素的名称 1

Element 对象方法描述DOM
继承所有Node对象的方法
getAttribute() 返回属性的值。 1
getAttributeNS() 返回属性的值,仅适用于XML。 2
getAttributeNode() 以 Attribute 对象返回属性节点 1
getAttributeNodeNS() 以 Attribute 对象返回属性节点,仅适用于XML。 3
getElements ByTagName() 找到具有指定标签名的子孙元素。 1
getElementsByTagNameNS() 找到具有指定标签名和命名空间的元素,仅适用于XML。 2
hasAttribute() 返回元素是否拥有指定的属性。 2
hasAttributeNS() 返回元素是否拥有指定的属性,仅适用于XML。 2
removeAttribute() 删除指定的属性。 1
removeAttributeNS() 删除指定的属性,仅适用于XML。 2
removeAttributeNode() 删除指定的属性节点。 1
setAttribute() 添加新属性。 1
setAttributeNS() 添加新属性,仅适用于XML。 2
setAttributeNode() 添加或改变属性节点。 1
setAttributeNodeNS() 添加或改变属性节点。 2
setIdAttribute() 如果 Attribute 对象 isId 属性为 true,那么此方法会把指定的属性声明为一个用户确定 ID 的属性(user-determined ID attribute)。 3
setIdAttributeNS() 如果 Attribute 对象 isId 属性为 true,那么此方法会把指定的属性声明为一个用户确定 ID 的属性(user-determined ID attribute)(带有命名空间)。 3
setIdAttributeNode() 如果 Attribute 对象 isId 属性为 true,那么此方法会把指定的属性声明为一个用户确定 ID 的属性(user-determined ID attribute)。 3

---------------------------------------------------------------------------------------------------------

            ╔════════╗
╠════╣    第A6个    ╠══════════════════════════════════════════════════╣
            ╚════════╝

●·● DOM Attr 对象

▷ w3school (英):http://www.w3schools.com/jsref/dom_obj_attr.asp

▷ 中文参考:http://blog.sina.com.cn/s/blog_61e439e5010167in.html

Attr 对象表示 Element 对象的属性。
Attr 对象属性描述DOM
继承所有Node对象的属性
isId 如果属性是 id 类型,则返回 true,否则返回 false。 3
name 返回属性的名称。 1
ownerElement 返回属性所附属的元素节点。 2
schemaTypeInfo 返回与属性相关联的类型信息。 3
specified 如果属性值被设置在文档中,则返回 true,如果其默认值被设置在 DTD/Schema 中,则返回 false。 1
value 设置或返回属性的值。 1

 


---------------------------------------------------------------------------------------------------------

            ╔════════╗
╠════╣    第G1个    ╠══════════════════════════════════════════════════╣
            ╚════════╝

●·● DOM Document 对象

▷ w3school (英):http://www.w3schools.com/jsref/dom_obj_document.asp

▷ w3school (中):http://www.w3school.com.cn/htmldom/dom_obj_document.asp

1. 每个载入浏览器的 HTML 文档都会成为 Document 对象. Document 对象使我们可以从脚本中对 HTML 页面中的所有元素进行访问.

  Document 对象是 Window 对象的一部分, 可通过 window.document 属性对其进行访问.

2. 方法:

  • getElementById(id):返回对拥有指定 id 的第一个对象的引用.
  • getElementByName(name):返回带有指定名称的对象集合.
  • getElementByTagName(tagname):返回带有指定标签名的对象集合.
  • open(mimetype, replace):可打开一个新文档, 并擦除当前新文档的内容.
  • close():关闭打开的输出流.
  • write(exp1, exp2, exp3, ...):向文档写 HTML 表达式 或 JavaScript 代码.
  • writeln():自动换行.

---------------------------------------------------------------------------------------------------------

            ╔════════╗
╠════╣    第G2个    ╠══════════════════════════════════════════════════╣
            ╚════════╝

●·● DOM Event 对象

▷ w3school (英):http://www.w3schools.com/jsref/dom_obj_event.asp

▷ w3school (中):http://www.w3school.com.cn/htmldom/dom_obj_event.asp

1. Event 对象代表事件的状态, 比如事件在发生的元素, 键盘按键的状态, 鼠标的位置, 鼠标按钮的状态. 事件通常与函数结合使用, 函数不会在事件发生前被执行.

2. 鼠标 / 键盘属性:

  • altKey:返回当事件被触发时, "ALT" 是否被按下.
  • ctrlKey
  • shiftKey
  • metaKey
  • button:返回一个整数, 指示哪个鼠标按键被点击.
      0 - 左键
      1 - 中键
      2 - 右键
  • relatedTarget:返回与事件的目标节点相关的节点.
  • clientX:相对于浏览器页面(或客户区)的水平坐标(px).
  • clientY
  • screenX:相对于整个屏幕的水平坐标(px).
  • screenY

3. 事件句柄:

  • onabort:图像加载被中断.  <img>  image
  • onblur:元素失去焦点, 点别的了.  <a>, <input>, <p> ...  button, checkbox ...
  • onchange:文本改变时发生.  <input type="text"> ...  text, textarea ...
  • onclick:点击的时候触发.  <a>, <input>, <p> ...  button, checkbox ...
  • ondblclick:双击时触发.  <a>, <input>, <p> ...   document, link
  • onerror:加载发生错误时.  <img> ...  window, image
  • onfocus:对象获得焦点时.  <a>, <input>, <p> ...  button, checkbox ...
  • onkeydown:某个按键按下.  <a>, <input>, <p> ...  document, image ...
  • onkeypress:某个按键按下并松开.
  • onkeyup:某个按键被松开.
  • onmousedown:鼠标按钮被按下.  <a>, <input>, <p> ...   button, document, link
  • onmousemove:鼠标被移动.
  • onmouseout:鼠标从某个元素移开.
  • onmouseover:鼠标移到某个元素之上.
  • onmouseup:鼠标按钮被松开.
  • onload:页面或图像完成加载时触发.  <img> ...  image, window ...
  • onreset:重置按钮被点击.  <form>  form
  • onresize:窗口或框架大小发生变化的时候触发.  <a>, <input>, <p> ...  window
  • onselect:文本框中的文字被选中时触发.  <input type="text"> <textarea>  window
  • onsubmit:表单中的确定按钮被点击时发生.  <form>  form
  • onunload:用户退出页面时发生.  <body>, <frameset>  window

---------------------------------------------------------------------------------------------------------

            ╔════════╗
╠════╣    第G3个    ╠══════════════════════════════════════════════════╣
            ╚════════╝

●·● DOM Element 对象

▷ w3school (英):http://www.w3schools.com/jsref/dom_obj_all.asp

1. 下面的属性和方法可以被所有的 HTML 元素使用. 同时所有的元素也可以是使用 Node objectElement object 的属性和方法.

2. 属性:

  • accessKey:设置或返回一个元素的 accesskey, 可以通过 Alt+accesskey 来操作. 
  • className:设置或返回一个元素的 class 属性.
  • id:设置或返回一个元素的 id, 用来标识元素的.
  • innerHTML:设置或返回一个元素的 HTML 内容.
  • lang:设置或返回一个元素的语言.
  • style:设置或返回一个元素的 style 属性.
  • tabIndex:设置或返回一个元素的 tab 顺序.
  • title:设置或返回一个元素的 title 属性.
  • dir:设置或返回一个元素的文本方向. "ltr" - LeftToRight, "rtl" - RightToLeft. 

  • clientHeight:返回元素的高度(不包括 borders, margins, scrollbars).
  • clientWidth
  • offsetHeight:返回元素的高度, 包括 borders 和 paddings, 不包多 margins.
  • offsetWidth
  • offsetLeft:返回相对于其容器的做偏移量.
  • offsetTop
  • offsetParent:返回其容器的元素.
  • scrollHeight:返回元素的整个高度.
  • scrollWidth
  • scrollLeft:返回元素的实际左偏移量.
  • scrollTop

 


---------------------------------------------------------------------------------------------------------

            ╔════════╗
╠════╣    第G4个    ╠══════════════════════════════════════════════════╣
            ╚════════╝

●·● DOM Anchor 对象

▷ w3school (英):http://www.w3schools.com/jsref/dom_obj_anchor.asp

▷ w3school (中):http://www.w3school.com.cn/htmldom/dom_obj_anchor.asp

1. Anchor 对象表示 HTML 超链接, 在 HTML 中 <a> 出现, 就会创建 Anchor 对象. 锚可以创建另一个文档的链接, 也可以创建文档内书签, 可以通过 document.anchors[] 数组来访问锚, 也可以通过 document.getElementById(). 同时也可以使用 Node object 和 Element object 的属性和方法.

2. 属性:

 

  • accessKey:设置或返回访问一个链接的快捷键。
  • charset:设置或返回被链接资源的字符集。
  • coords:设置或返回逗号分隔列表,包含了图像映射中链接的坐标。
  • href:设置或返回被链接资源的 URL。
  • hreflang:设置或返回被链接资源的语言代码。
  • id:设置或返回一个链接的 id。
  • innerHTML:设置或返回一个链接的内容。
  • name:设置或返回一个链接的名称。
  • rel:设置或返回当前文档与目标 URL 之间的关系。
  • rev:设置或返回目标 URL 与之间当前文档的关系。
  • shape:设置或返回图像映射中某个链接的形状。
  • tabIndex:设置或返回某个链接的 Tab 键控制次序。
  • target:设置或返回在何处打开链接。
  • type:设置或返回被链接资源的 MIME 类型。

3. 标准属性:

  • className:设置或返回元素的 class 属性。
  • dir:设置或返回文本的方向。
  • lang:设置或返回元素的语言代码。
  • title:设置或返回元素的 title 属性。

4. 方法:

  • blur():把焦点从链接上移开。
  • focus():给链接应用焦点。

 

---------------------------------------------------------------------------------------------------------

            ╔════════╗
╠════╣    第G5个    ╠══════════════════════════════════════════════════╣
            ╚════════╝

●·● DOM Area 对象

▷ w3school (英):http://www.w3schools.com/jsref/dom_obj_area.asp

▷ w3school (中):http://www.w3school.com.cn/htmldom/dom_obj_area.asp

1. Area 对象代表图像映射的一个区域(图像映射指带有可点击区域的图像), 在 HTML 中 <area> 出现, 就会创建 Area 对象. 同时也可以使用 Node object 和 Element object 的属性和方法.

2. 属性:

 

  • accessKey:设置或返回访问某个区域的快捷键。
  • alt:设置或返回当浏览器无法显示某个区域时的替换文字。
  • coords:设置或返回图像映射中可点击区域的坐标。
  • hash:设置或返回某个区域中 URL 的锚部分。
  • host:设置或返回某个区域中 URL 的主机名和端口。
  • href:设置或返回图像映射中链接的 URL。
  • id:设置或返回某个区域的 id。
  • noHref:设置或返回某个区域是否应是活动的还是非活动的。
  • pathname:设置或返回某个区域中的 URL 的路径名。
  • protocol:设置或返回某个区域中的 URL 的协议。
  • search:设置或返回某个区域中 URL 的查询字符串部分。
  • shape:设置或返回图像映射中某个区域的形状。
  • tabIndex:设置或返回某个区域的 tab 键控制次序。
  • target:设置或返回在何处打开区域中的 link-URL。

 

---------------------------------------------------------------------------------------------------------

            ╔════════╗
╠════╣    第G6个    ╠══════════════════════════════════════════════════╣
            ╚════════╝

●·● DOM Body 对象

▷ w3school (英):http://www.w3schools.com/jsref/dom_obj_body.asp

▷ w3school (中):http://www.w3school.com.cn/htmldom/dom_obj_body.asp

1. Body 对象代表文档的主体(HTML body). 同时也可以使用 Node object 和 Element object 的属性和方法.

2. 属性:

  • link:设置或返回 link 颜色值, 即链接的颜色.
  • aLink:设置或返回 active link 颜色值, 即鼠标点瞬间的颜色值.
  • vLink:设置或返回 visited link 颜色值, 即访问链接后的颜色值.
  • background:设置或返回 background 属性.(可以是图片).
  • bgColor:设置或返回背景颜色值.
  • text:设置或返回 body 内部文本的颜色值.

---------------------------------------------------------------------------------------------------------

            ╔════════╗
╠════╣    第G7个    ╠══════════════════════════════════════════════════╣
            ╚════════╝

●·● DOM Button 对象

▷ w3school (英):http://www.w3schools.com/jsref/dom_obj_pushbutton.asp

▷ w3school (中):http://www.w3school.com.cn/htmldom/dom_obj_pushbutton.asp

※ 参考:button和input button的区别

1. Button 对象代表一个按钮, 在 HTML 中 <button> 出现, Button 对象就会被创建.

2. 属性:

 

  • accessKey:设置或返回访问某个按钮的快捷键。
  • disabled:设置或返回是否禁用按钮。
  • form:返回对包含按钮的表单的引用。
  • id:设置或返回按钮的 id。
  • name:设置或返回按钮的名称。
  • tabIndex:设置或返回按钮的 Tab 键控制次序。
  • type:返回按钮的表单类型。
  • value:设置或返回显示在按钮上的文本。

 

---------------------------------------------------------------------------------------------------------

            ╔════════╗
╠════╣    第G2个    ╠══════════════════════════════════════════════════╣
            ╚════════╝

●·● DOM Event 对象

▷ w3school (英):http://www.w3schools.com/jsref/dom_obj_event.asp

▷ w3school (中):http://www.w3school.com.cn/htmldom/dom_obj_event.asp

1. Event 对象代表事件的状态

---------------------------------------------------------------------------------------------------------

            ╔════════╗
╠════╣    第G2个    ╠══════════════════════════════════════════════════╣
            ╚════════╝

●·● DOM Event 对象

▷ w3school (英):http://www.w3schools.com/jsref/dom_obj_event.asp

▷ w3school (中):http://www.w3school.com.cn/htmldom/dom_obj_event.asp

1. Event 对象代表事件的状态

---------------------------------------------------------------------------------------------------------

            ╔════════╗
╠════╣    第G2个    ╠══════════════════════════════════════════════════╣
            ╚════════╝

●·● DOM Event 对象

▷ w3school (英):http://www.w3schools.com/jsref/dom_obj_event.asp

▷ w3school (中):http://www.w3school.com.cn/htmldom/dom_obj_event.asp

1. Event 对象代表事件的状态

---------------------------------------------------------------------------------------------------------

            ╔════════╗
╠════╣    第G2个    ╠══════════════════════════════════════════════════╣
            ╚════════╝

●·● DOM Event 对象

▷ w3school (英):http://www.w3schools.com/jsref/dom_obj_event.asp

▷ w3school (中):http://www.w3school.com.cn/htmldom/dom_obj_event.asp

1. Event 对象代表事件的状态

---------------------------------------------------------------------------------------------------------

            ╔════════╗
╠════╣    第G2个    ╠══════════════════════════════════════════════════╣
            ╚════════╝

●·● DOM Event 对象

▷ w3school (英):http://www.w3schools.com/jsref/dom_obj_event.asp

▷ w3school (中):http://www.w3school.com.cn/htmldom/dom_obj_event.asp

1. Event 对象代表事件的状态

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

           ╔════════╗
╠════╣    第G2个    ╠══════════════════════════════════════════════════╣
            ╚════════╝

posted on 2012-08-23 22:11  McDelfino  阅读(340)  评论(0编辑  收藏  举报