js dom操作

1.客户端检测
1.1客户端检测主要包括浏览器的识别和操作系统的识别
navigator.oscpu 检测操作系统
navigator.vendor 检测开发商信息
navigator.platform 检查浏览器所在的操作系统
screen.colorDepth 和screen.pixelDepth检查像素的位深
2 dom操作
document节点表示问个文档的根节点，根节点唯一的子节点是HTML元素，也叫做文档节点。
2.1Node类型
HTML中所以的节点都集成Node类型，每个节点都有自己的nodeType。用来表示节点的类型。node类型一共有12中类型

节点类型    描述  子节点
1   Element 代表元素    Element, Text, Comment, ProcessingInstruction, CDATASection, EntityReference
2   Attr    代表属性    Text, EntityReference
3   Text    代表元素或属性中的文本内容。  None
4   CDATASection    代表文档中的 CDATA 部分（不会由解析器解析的文本）。   None
5   EntityReference 代表实体引用。 Element, ProcessingInstruction, Comment, Text, CDATASection, EntityReference
6   Entity  代表实体。   Element, ProcessingInstruction, Comment, Text, CDATASection, EntityReference
7   ProcessingInstruction   代表处理指令。 None
8   Comment 代表注释。   None
9   Document    代表整个文档（DOM 树的根节点）。  Element, ProcessingInstruction, Comment, DocumentType
10  DocumentType    向为文档定义的实体提供接口   None
11  DocumentFragment    代表轻量级的 Document 对象，能够容纳文档的某个部分  Element, ProcessingInstruction, Comment, Text, CDATASection, EntityReference
12  Notation    代表 DTD 中声明的符号。  None

每个Node类型的节点都有nodeName nodelValue保存相关的节点的信息。在使用这两个属性之前，最好判断一下当前节点是不是元素。nodeName表示节点的标签名。
每个节点都有childNodes属性。得到一个NodeList实例对象。该对象是一个类数组。NodelList是一个动态对象，它包含的字节发生变化，Node对象都会发生变化。每个节点都还有previousSibling和nextSibling属性。previousSibling表示当前节点的上个节点。nextSibling表示当前节点的下一个节点。firstChild表示NodelList的第一个节点。lastChild表示NodelList表示最后一个。
DOM为操作节点提供了appendChild方法。appendChild表示插入当前节点尾部。insertBefor方法表示插入到目标节点的前面。replaceChild表示替换目标节点。removeChild表示删除一个节点
3 Document类型
Document类型的nodeType为9 nodeName="#document"
document保存着文档的信息。比如document.domain 客户端的域名 document.URL保存的是客户端的URL
Document同时保存着节点的定位元素。比如document.getElementById("")。如果id不存在，返回Null。document.getElementByTagName()。参数为标签名，返回一个NodelList对象。如果给标签指定了name属性。NodelList可以通过nameItem获取到指定Node节点。
document还保存着特殊的集合。比如document.anchors 表示所有带name属性的a标签。。。
4 Element类型
Elemnt类型的NodeType为1 nodeType值为元素的标签名称。Element类型的nodeName和tagName一致
5 HTML元素
HTML元素拥有很多标准的属性。比如 id title lang dir clasName。这些属性可以通过getAttribute()获取属性的值。setAttribute()设置属性的值，也可以设置一些自定的属性，removeAttribute()删除属性。HTML元素可以使用attributes属性，获取到一个类型NodeList的集合NameNodeMap。NameNodeMap有3个方法 getNamedItem,返回nodeNmae属性等于name的节点。removeNameItem 删除nodeName属性等于name的节点。setNamedItem(node)，向列表中添加node节点。使用document.createElement方法创建元素
6 Text类型
Text类型nodeType为3