DOM中常见的节点操作方法

1.创建节点

    a.创建元素节点:document.createElement("div");

    b.创建文本节点:document.createNode("Hello world");

2.插入节点

    a.在父元素中插入节点:parentNode.appendChild(newNode); 

    b.将节点插入到父元素之前:parentNode.insertBefore(newNode,positionNode);

3.获取节点

    a.获取单个节点

        1) document.getElementById();

        2) document.querySelector();匹配指定css选择器元素的第一个子元素 

    b.获取多个元素

        1) document.getElementsByTagName(); //返回一个对象数组(准确的说是HTMLCollection集合
        2) document.getElementsByName(); //返回一个有相同name的数组
        3) document.getElementsByClassName(); 返回文档中所有指定类名的元素集合,作为 NodeList 对象

        4) document.querySelectorAll();//匹配指定css选择器元素的所有子元素 

    c.获取父元素  ele.parentNode;

    d.获取子元素 ele.children;

    e.获取兄弟节点

        1) ele.previousElementSibling;//上一个兄弟元素 

        2)ele.nextElementSibling//下一个兄弟元素

     e.节点移除   parentNode.removeChild(childNode)

     f.替换子元素  parentNode.replaceChild(newNode,oldNode)

    g.复制元素  ele.cloneNode(boolean);      boolean为true,同时复制子节点。

4.属性操作 

    ele.setAttribute(name,value)//设置属性 
    ele.getAttribute(name)//获取元素的属性 
    ele.removeAttribute(name)//移除属性




评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值