|
今日学习内容：BOM&DOM自定义属性的用法 自定义属性概述 data-属性名 = "自定义属性的值" 键值对的方式来描述HTML 标签的扩展属性 标准属性--标签自带的一些属性，内置的 自定义属性的操作 H4 dom.getAttribute('属性名')---获取自定义属性的值 dom.setAttribute('属性名','属性的值')---修改/新增自定义属性的值 dom.removeAttribute('属性名')---移除自定义属性 H5 标签上 data-属性名="属性值" js获取或者设置 获取：dom.dataset.属性名 修改/新增：dom.dataset.属性名=属性值 排他思想排他思想是为一组同类型元素中的某一个元素设置样式时，采用的一种特定顺序 优势：适用于多个同类型元素设置样式或者效果的情况，避免为单个元素重复设置相同样式，可以有效显示出用户操作下某一元素的改变 步骤： 1.为全部元素设置一般效果 2.为特定元素设置特定效果 节点操作子找父，父找子 html文档中每一个成员都是一个节点对象，节点对象具有自己的属性和方法 html节点 document.documentElement 整个窗口的高度 document.documentElement.clientHeight body节点 document.body 内容的高度 document.body.clientHeight 父节点---parentNode 会受到回车，空格的影响，有可能获取到文本节点 列表中的第一个节点----firstChild 列表中的最后一个节点----lastChild 所有的子节点的列表----childNodes 不会收到回车空格的影响，获取到的是元素节点，标签节点 列表中的第一个元素节点---firstElementChild 列表中的最后一个元素节点---lastElementChild 列表中的所有元素节点---children 向上查找：找到离得最近的父级节点 closest('选择器') 兄弟节点 nextElementSibling---下一个兄弟元素节点 previousElementSibling---上一个兄弟元素节点 新增节点 创建节点 document.createElement('tagName'); 插入节点 父节点.appendChild('子节点') 父节点.insertBefore('要插入的节点',目标节点) 删除节点 removeChild(要删除的子节点);
| 
