zoukankan      html  css  js  c++  java
  • dom中一些节点获取和增改

    1获取标签里的文本对象:

    对象.innerText 获取标签里的文本内容     早期的火狐浏览器中是不支持的 赋值会输出转义后的内容
    对象.innerHTML 获取标签里的所有内容 赋值会输出原样 都兼容
    对象.textContent 获取标签里的文本内容   IE8之前包括ie8不支持 

    2 自定义属性 自定义属性 js无法通过点的方式获得

    对象.getAttribute("属性名")  得到自定义属性对象
    对象.setAttribute("属性名",”属性值“) 设置自定义属性对象
    对象.removeAttribute("属性名") 去除属性

    3节点的种类

      nodeType节点名称  nodeName节点的名字   nodeValue节点值
    标签 1 标签名 null
    属性 2 属性名 属性值
    文本 3 #text 文本内容没有就为空

    4获得节点的方式

    获得属性节点 对象.getAttributeNode("属性名")  获得属性节点  
    获得父节点元素 对象.parentNode  获得父节点元素  
    获得儿子节点 对象.children  获得子节点元素(无兼容问题只获得标签元素)  
      对象.childNodes 获得子节点(包括文本节点和标签节点) e8之前的版本会忽略文本元素
      对象.firstChild 第一个子节点   
      对象.firstElementChild 第一个子元素节点 IE8之前不兼容
      对象.lastChild 最后一个子节点   
      对象.lastElementChild 最一个子元素节点  IE8之前不兼容
    获得兄弟姐妹节点 nextSibling 下一个紧邻节点 下一个紧邻节点,chrome 火狐都支持的,只不过呢,有可能 会获得文本节点,IE8及之前的浏览器会忽略空白文本节点,如果文本有内容,也会获得到
      nextElementSibling 下一个紧邻的元素节点,

    谷歌和火狐都可以获得下一个紧邻的元素节点,
    而IE8及之前的版本不支持

      previousSibling 上一个紧邻节点 上一个紧邻节点,chrome 火狐都支持的,只不过呢,有可能 会获得文本节点,IE8及之前的浏览器会忽略空白文本节点,如果文本有内容,也会获得到
      previousElementSibling 上一个紧邻的元素节点

    谷歌和火狐都可以获得上一个紧邻的元素节点,
    而IE8及之前的版本不支持

    克隆节点 节点.cloneNode(true) 复制节点中的全部包括文本 标签元素    
            节点.cloneNode(false) 自复制节点标签  
    删除节点 父元素.removechild(要删除的子元素)     
    增加节点

    父节点.appendChild

    (新生成的子节点)

    在父元素最后增加  
     

    父节点.insertBefore

    (新生成的子节点,某个子节点)

     在某个子节点前增加

    新生成的子节点

    在某个子元素前增加  

    5动态创建节点

  • 相关阅读:
    10. Regular Expression Matching
    Leetcode:9. Palindrome Number
    MySQL
    MyBatis Plus 自动类型转换之TypeHandler
    深拷贝和浅拷贝
    【强制】不要在程序中写死一年为 365 天,避免在公历闰年时出现日期转换错误或程序逻辑 错误。
    【强制】日期格式化时,传入 pattern 中表示年份统一使用小写的 y。
    【推荐】循环体内,字符串的连接方式,使用 StringBuilder 的 append 方法进行扩展。
    【强制】POJO如果继承了另一个 POJO 类,注意在前面加一下 super.toString。
    【强制】禁止使用构造方法 BigDecimal(double)的方式把 double 值转化为 BigDecimal 对象。
  • 原文地址:https://www.cnblogs.com/wjl3898/p/5747542.html
Copyright © 2011-2022 走看看