• 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动态创建节点

  • 相关阅读:
    STL 算法 std::min
    SAP UI5 初学者教程之五:视图控制器初探 试读版
    SAP UI5 的初始化过程
    Angular 应用里的摇树优化
    Angular 应用里的 vendor.js 是用来干什么的?
    SAP UI5 初学者教程之四:XML 视图初探试读版
    SAP UI5 初学者教程之三:开始接触第一个 SAP UI5 控件 试读版
    SAP UI5 初学者教程之二:SAP UI5 的引导过程(Bootstrap) 试读版
    SAP UI5 初学者教程之一:Hello World 试读版
    SAP UI5 初学者教程的学习目录
  • 原文地址:https://www.cnblogs.com/wjl3898/p/5747542.html
Copyright © 2020-2023  润新知