文档树
DOM(Document Object Model)
DOM Core
DOM HTML
DOM Style
DOM Event
节点遍历
IoUsSibling //node节点的上一个兄弟节点
node.nextSibling //node节点的下一个兄弟节点
节点类型
ELEMENT_NODE(元素节点)
TEXT_NODE(文本节点)
COMMENT_NODE(不常用)
DOCUMENT_TYPE_NODE(不常用)
元素遍历
IoUsElementSibling //node节点的前一个兄弟元素节点
节点操作
获取节点
getElementById
获取到id为type的节点
getElementsByClassName
获取到p节点下所有类名是flag的节点
getElementsByTagName
获取到p节点下所有标签是span的节点
querySelector
应用-兼容ie6
创建节点
createElement
名称
标签名
innerHTML
名称
应用
节点各数
事件处理
结合使用
Box = document.createElement('div');
Box.innerHTML = tpl;
var list = Box.getElementsByClassName('j-flag');
list[0].src = '/imgurl.jpg';
list[1].innerText = 'my name is netease';
插入节点
appendChild
名称
users
insertBefore
名称
users
insertAdjacentElement
名称
users
@H_743_301@
insertAdjacentHTML
名称
users
@H_743_301@
应用- insertAdjacentElement
修改节点
innerHTML
原文链接:https://www.f2er.com/note/422410.html