<h2 class="md-end-block md-heading md-focus"><span class="md-expand">一、javascript的三大核心
1.ECMAScript js的语法标准
2.DOM Document object Model 文档对象模型,提供的方法可以让js操作html标签
3.BOM Browser Object Model 浏览器对象模型,提供的方法让js可以操作浏览器
注意:1. js里最大的boss是window,document只是window下的一个对象
- document.documentElement 这个东西可以拿到html
Meta Meta">...
Meta">...
二、DOM的属性
js ---> DOM --> html
js通过DOM去操作html标签
- childNodes 返回当前对象下的所有子节点对象,会返回文本节点
注意: 在ie8下只会返回元素节点
- nodeType 返回节点类型,元素节点返回1 文本节点返回3 注释节点返回8
- children 返回对象下所有子元素节点,并且没有兼容问题
- firstChild 返回第一个子节点,在IE8跟childNodes一样的表现
- lastChild 返回最后一个子节点 同上
- firstElementChild 返回最后一个元素节点,不兼容IE8
- nextSibling 下一个兄弟节点 在主流的浏览器,可能会拿到除了元素节点以外的节点,在IE8里,只会返回元素节点,如果没有就返回null
- prevIoUsSibling 上一个兄弟节点 同上
- nextElementSibling 下一个兄弟元素节点 如果没有返回null 不兼容IE678
- prevIoUsElementSibling 上一个 同上
- parentNode * 返回父节点 没有兼容性
- offsetParent 返回定位父级,如果都没有找到,最后返回body上,没有兼容问题
三、DOM的一些方法
createElement(‘p’)
这个里面是标签
新建元素节点,需要接受一个参数,参数就是需要新建的标签。
createTextNode()
新建文本节点
createComment()
新建注释节点
节点操作
添加元素节点
1. 父级.appendChild(子节点)
把子节点添加到父节点里去 往父级的所有子元素节点后 追加一个节点
2. 父级.insertBefore(子节点,指定的子节点)
添加到指定的节点前面
- 父级.removeChild(需要删除的节点)
1.克隆节点 cloneNode
克隆节点, 克隆母体.cloneNode()
函数接收一个参数,这个参数是一个布尔值,默认false,浅复制, true深度复制
浅复制:只复制标签
深度复制:把跟这个标签对象相关的一些标签的行内的信息一起复制,不会复制js里的自定义属性。
这是我对dom学习的笔记,如果能够帮助到你,我会非常高兴。
原文链接:https://www.f2er.com/nodejs/238726.html