2018.9.4 星期二

Document类型
document对象是HTMLDocument的一个实例。
HTMLDocument继承自Document。
document存在window中。即document对象是window对象的一个属性，因此可以直接调用。

Document的属性和方法：

文档子节点，可以继承Node中所有的属性和方法。
属性：通过document对象获取。document.title
documentElement 始终指向HTML页面中元素
body 直接指向元素
title 获取文档的标题
URL 路径。取得完整的URL。统一资源定位符。
domain 取得域名，并且可以进行设置，在跨域访问在经常会用到。
referrer 取得前一个页面的URL，即来源页面的URL。
doctype 访问
images 获取所有的img对象，返回HTMLCollection类数组对象。
forms 获取所有的form对象，返回HTMLCollection类数组对象。
links 获取文档中所有的带有href属性的元素

**查找元素：**
    注意：因为id属性是唯一的，所以Element不加s，其他3个方法用复数Elements。
   getElementById()
       通过id获取，如果找到对应的id则返回该元素，否则返回null。
       如果页面中有多个元素的id值相同，只返回文档中第一次出现的元素。
   getElementsByTagName()
       参数为要取得元素的标签名。
       返回类数组对象，即HTMLCollection对象。
       如果元素中有id或name，会将id和name的值都映射成为HTMLCllection对象的属性。
       可以通过namedItem(id值或者name值)访问
       item[0]
       [0]
   getElementsByName('name')
       参数为元素的name
       返回值是NodeList类数组，即HTMLCollection对象。
       是通过name属性值来获取的 
   getElementsByClassName('class')
       参数为一个字符串
       多个class属性值以空格隔开。
       返回值是HTMLCollection类数组。
   createElement('标签名')
       创建一个元素节点，要记得追加节点
   createAttribute('id')  Attr实例

Element类型：
HTML元素：
所有的HTML元素都由HTMLElement类型表示，或者其子类型表示。
每个HTML元素都应具有如下一些属性以及html元素特有的属性。
id 元素在文档中的唯一标识
title 有关元素的附加说明信息
className 与元素class特性对应
src img元素具有的属性
alt img元素具有的属性
lang 元素内容的语言代码，很少使用！
dir 语言方向，ltr左到右，rtl右到左

 特性的名称不区分大小写。

 **取得自定义属性：**
     getAttribute()参数为实际元素的属性名，class,name,id,title,lang,dir一般只有在取得自定义特性值的情况下，才会用该方法。大多数直接用属性进行访问，比如style,onclick。
 **设置属性：**
     dom.className="one";
     dom.setAttribute("className","one");
 **移除属性：**
     removeAttribute();
 attribute属性，其中包含了一个NameNodeMap，与NodeList类似。
     getNamedItem(name)   返回nodeName属性等于name的节点
     removeNamedItem(name)   从列表中删除nodeName属性等于name的节点
     setNamedItem(node)   向列表中添加一个节点
     item(2)   返回位于位置2处的节点
 **创建元素：**
     createElement() 参数为要创建的元素标签名，
            该标签名在HTML中不区分大小写，但在XML中区分大小写。    

/*属性 Attr：
   元素对象.属性名  获取属性值
   元素对象.getAttribute('属性名')
       获取属性值，获取自定义属性值
       一般情况下，获取style和onclick属性的时候，返回的是字符串
       元素对象.属性名 = 属性值
           添加或修改属性值
       元素对象.setAttribute('属性名','属性值')
            添加或修改属性值
       attrs = 元素对象.attributes
            获取所有的属性组成的类数组对象

            该类数组对象有以下方法：
               attrs.getNamedItem('属性名')
                  获取属性名对应的元素
                  返回值是一个Attr实例，id = 'one'
               attrs.removeNamedItem('属性名')  
                  删除属性名对应的元素 
               attrs.setNamedItem(Attr实例);

                 如何创建Attr实例？并设置值？
                 var node = document.createAttrebute('属性名');
                 node.value = '属性值';    
                 item(index)  获取index位置上的元素  */

作为文档树的文档，将文档看作是Element对象树，忽略文档Text,Comment节点。
以下是Element中的属性：
children 所有元素孩子节点。类似于childNodes,返回NodeList对象，但是该对象中仅包含Element对象。
firstElementChild 第一个孩子元素节点
lastElementChild 最后一个孩子元素节点
nextElementSibling 下一个兄弟元素节点
previousElementSibling 上一个兄弟元素节点
childElementCount 子元素的数量，返回值和children.length的值相等。

元素内容：
innerHTML 返回元素内容
innerText 内部文本
textContent

Text类型
文本节点。包含的是可以按照字面解释的纯文本内容。

length 文本长度
appendData(text) 追加文本
deleteData(beginIndex,count) 删除文本。参数为删除起点和删除个数。
insertData(beginindex,text) (在起始位置前)插入文本。参数为插入的起始位置和文本。
replaceData(beginIndex,count,text) 替换文本
splitText(beginIndex) 从beginIndex位置将当前文本节点分成两个文本节点
document.createTextNode(‘文本’) 创建文本节点，参数为要插入节点中的文本
substringData(beginIndex,count) 从beginIndex开始提取count个子字符串

Comment类型

Document的创建方法:
createElement(‘标签名’)
createAttribute(‘属性名’)
createTextNode(‘文本’)