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

标题: 谷江涛-20221109-节点的操作 [打印本页]

作者: 暴风雨    时间: 2022-11-9 23:44
标题: 谷江涛-20221109-节点的操作
一、今日内容
  h4
获取自定义属性    dom.getAttribute('属性')
修改自定义属性    dom.setAttribute('属性')
h5
<div id='box'  data-sex='20'></div>
获取自定义属性
dom.dataset.sex
设置自定义属性
dom.dataset.sex='属性值'
节点操作
特殊的节点
获取 html body 的节点
let html=document.documentElement;
let  body=document.body
子节点找父节点
parentNode
closest('父元素')  方法  向上找父元素
父节点找子节点
firstchild   lastchild childNodes   会受到空格 回车的影响  可能获取文本节点
children  所有子节点的集合  不是数组  需要用for循环遍历获取里面的子节点
firstElementchild    lastElementchild   获取父节点的第一个子节点 和最后一个子节点  不会受到空格和回车的影响
兄弟节点
nextsibling  previousSibling  获取兄弟节点的下一个和上一个 会受到回车和空格的影响
nextElementsibling   previoussibling  获取兄弟节点的下一个和上一个 获取下一个兄弟节点  上个兄弟节点
创建节点
createElement()
let p=document.createElement('p')   创建了个p节点  
添加到父节点中
父节点.appendchild(p);
添加节点
先获取body节点
body.insertbefore(添加的节点,添加的位置)
删除节点
先获取body节点
body.removechild(删除的节点);
a标签阻止跳转
herf='javascript:   ;

给a添加点击事件  e.preventdefault();





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