DOM

`nodeType`、`nodeName`、`nodeValue`

一个节点具有以上基本的三个属性，nodeType表示其基本的属性，值为Number，不同的数字代表着不同的类型，nodeName标签名，nodeValue始终为null。一般检验是否为一个节点nodeType === 1

`document`

document.body       // body
document.doctype    // 文档类型
document.title      // title内容
document.URL        // 页面完整的url
document.referrer   // 来源页面的URL
document.domain     // 页面的主域

获取`dom`节点的方法

document.getElementById('Id')
document.getElementsByTagName("*")
document.getElementsByClassName()
document.querySelector()
document.querySelectorAll()

文档写入

write()         // 向文档中写入
writeIn()       // 同上，但会在字符串的末尾添加`\n`
open()          // 打开一个页面
close()         // 关闭一个页面

`HTML`元素节点访问

直接访问

element.id
element.className

getAttribute() 和 setAttribute()

element.getAttribute('id')
element.getAttribute('className')

‘attributes’

element.attributes.getNamedItem('id');
element.attributes.setNamedItem('id');
element.attributes.removeNamedItem('id');
element.attributes.item('id');

创建节点

DOM节点createElement()，type === 1

var div = document.createElement('div');

文字节点createTextNode，type === 2

var text = document.createTextNode('Text');

注释节点createComment，type === 8

var text = document.createComment('A comment');

文档节点createCDataSection，type === 4

var text = document.createCDataSection('![CDATA[This is some content.]]');

“轻量级”文档节点createDocumentFragment，type === 11

var text = document.createDocumentFragment();

属性节点 createAttribute，type === 2

var text = document.createAttribute('align');

元素遍历

childElementCount           // 子元素的个数
firstElementChild           // 指向第一个子元素
lastElementChild            // 指向最后一个子元素
previousElementSibling      // 子元素的个数
nextElementSibling          // 子元素的个数

`classList`

// 可以通过这个属性，对`className`进行管理，有四个方法
add(value)          \\ 添加
remove(value)       \\ 删除
contains(value)     \\ 存在给定的值
toggle(value)       \\ 已存在就删除，没存在就添加

焦点

document.activeElement      // 当前正获取焦点的元素
document.hasFocus()         // 当前文档是否获取了焦点

`readyState`目前文档的状态值可能为【`loading`正在加载、`complete`已经加载完成】

操作节点

appendChild
insertBefore
removeChild
innerHTML
outerHTML
insertAdjacentHTML()        // 两个参数,第一个参数为插入位置[beforebegin,afterbegin,beforeend,afterend]，第二个为dom节点

DOM

nodeType、nodeName、nodeValue

document

获取dom节点的方法