zoukankan      html  css  js  c++  java
  • dom操作节点-----怎样添加、移除、移动、复制、创建和查找节点?

    1)创建新节点

      document.createElement("标签名") //创建一个具体的元素
      document.createTextNode(“文本内容”) //创建一个文本节点   

    2)添加

      元素.appendChild(“节点/文本内容”) //添加  节点/文本内容 到 元素 的所有子节点的末尾
    
      元素.insertBefore(“需插入的节点/文本”,“指点的节点”) // 将需插入的节点/文本 插入到 指定节点 之前

    3)  文档碎片

    1.创建文档碎片
    var frag = document.createDocumentFragment()-----创建文档碎片
    2.先将创建的元素添加到文档碎片
      frag.appendChild("元素")
    3.将文档碎片添加到指定的元素中
      元素.appendChild(frag)

    4)  移除:

     父元素.removeChild(“被删除的子元素”) //移除父元素中的子元素
    
      元素.remove()//直接移除元素

    5)  替换:

     父元素.replaceChild(“新元素”,“旧元素”) // 用新元素替换旧元素

    6)查找---------获取页面元素

      document.getElementById("id 名") //通过元素Id,唯一性-----------------返回一个对象
      document.querySelector("选择器")----------------------选择器为类名或者id名,返回一个对象(只获取第一个对象)
      document.getElementsByTagName(“标签名”) //通过标签名称---------------返回一个伪数组
      document.getElementsByName(“name属性值") //通过元素的Name属性的值-----------返回伪数组
      document.getElementByClassName("类名")--------------返回伪数组,(火狐,谷歌支持,ie不支持)   document.querySelectorAll("选择器")------------------返回伪数组   document.documentElement----------------------注意,不是方法,所以不带(),获取html标签   document.body--------------------------注意,不是方法,所以不带(),获取body标签
  • 相关阅读:
    截取小数位数(准确四舍五入及直接截取)
    水印
    用心整理的 献丑啦 一些关于http url qs fs ...模块的方法
    html禁止清除input文本输入缓存的两种方法
    flink写入elasticsearch报错!OOM内存溢出!连接异常关闭!
    实现网格建造系统
    AcWing 1064. 小国王
    AcWing 1052. 设计密码
    KMP 模板
    AcWing 1058. 股票买卖 V
  • 原文地址:https://www.cnblogs.com/SRH151219/p/10382634.html
Copyright © 2011-2022 走看看