菁英数字科技（猩码）-猩码学苑-专注软件开发人才菁英教育

标题: 李扬敏-20221110-dom [打印本页]

作者: 王源的李可爱 时间: 2022-11-10 00:09
标题: 李扬敏-20221110-dom
一。今日学习内容

1.自定义属性

获取自带属性：dom.属性名

修改自带属性：dom.属性名=‘新的属性值’

获取自定义属性：dom.getAttribute（‘属性’）

修改自定义属性：dom.setAttribute（‘属性’，‘属性值’）

H5（定义：data-属性=‘属性值’）

获取自定义属性：dom.dataset.属性

设置自定义属性：dom.dataset.属性=新的值

2.节点操作

1）特殊节点

body=document.body;

html.document.documentElement；

2）父节点

parentNode：父级（可向上多层）

closest（‘选择器’）：向上查找，找离自己最近的祖先元素

3）子节点

firstChild，lastChild，childNodes：不一定是html节点，可能是本文节点，空格，回车，文本内容

children：子节点（集合--非数组-需要for遍历），不会受空格，回车影响

dom节点（不受空格回车影响），子节点

firstElementChild

lastElementChild

4）兄弟节点

文本标签--text

nextSibling：上一个节点

previousSibling：下一个节点

dom节点--标签

nextElementSibling：下一个节点（不受空格回车影响）

previousElementSibling：上一个节点（不受空格回车影响））

5）创建节点

document.createElenment();创建节点

6）添加节点

appendChild();添加节点，添加到父节点的最后，结束标签之前

父节点.insertBefore（要添加的节点，要添加的后面的位置）；插入到指定位置

7）删除节点

removeChild（）；

3.阻止a标签默认事件

点击事件添加方法：e.preventDefault()；----阻止a标签默认跳转事件

欢迎光临菁英数字科技（猩码）-猩码学苑-专注软件开发人才菁英教育 (http://www.xingmaxueyuan.com/)