JS中的节点操作

创建节点

create系列方法创建节点

方法	功能
document.createElement（）	创建一个元素节点
document.createTextNode（）	创建一个文本节点
document.createDocumentFragment（）	创建一个文档片段
document.createattribute（）	创建一个属性节点
document.createComment（）	创建一个注释节点

高效创建节点的方法

方法	功能
innerHTML	设置（写模式）或获取（读模式）当前标签的起始和结束里面的内容
outerHTML	设置（写模式）或获取（读模式）调用它的元素及所有子节点的HTML标签和文本
innerText	读模式：获取调用的它元素的所有子节点的文本。写模式：设置调用它的元素的所有的子节点
outerText	读模式：获取调用它的元素及所有子节点的文本。写模式：设置调用它的元素及所有的子节点

• 使用innerHTML的限制

限制
不同的浏览器返回的文本格式不同，IE和Opera会将所有的标签转化为大写形式。而Chrome、Safari、Firefox则会按照原本格式返回，包括空格和缩进
字符串的最左边不能出现空白，IE6-8会自动移除掉它
大多数浏览器不会对innerHTML插入的script标签进行脚本操作。IE8及更早版本可以执行，但是要满足2个条件，一是必须为script标签添加defer属性，二是script标签必须要在有作用域的元素之后
IE6-8中不能单独创建meta、style、link等元素，一定要在前面加上一些字符

• 兼容性问题

操作	兼容性
outerHTML	IE4+、Safari4+、Chrome、Opera8+、Firefox8+
innerText	IE4+、Safari3+、Chrome、Opera8+、Firefox不支持
outerText	IE4+、Safari3+、Chrome、Opera8+、Firefox不支持

查找节点

节点遍历

• 查找节点的API

描述	API
父节点查找第一个子节点	firstChild
父节点查找最后一个子节点	lastChild
父节点查找第n个子节点	childNodes[n] 、 childNodes.item