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

dom中一些节点获取和增改的更多相关文章

  1. DOM中元素节点、属性节点、文本节点的理解

    DOM中元素节点.属性节点.文本节点的理解 节点信息 每个节点都拥有包含着关于节点某些信息的属性.这些属性是:nodeName(节点名称) nodeValue(节点值) nodeType(节点类型)  ...

  2. javascript DOM中的节点层次和节点类型概述

    针对JS高级程序设计这本书,主要是理解概念,大部分要点源自书内.写这个主要是当个笔记加总结 存在的问题请大家多多指正! 因为DOM这方面的对象方法操作性都特别强,但是逻辑很简单,所以就没有涉及到实际的 ...

  3. DOM中文本节点索引方法

    问题 对于 jquery 接口text()只能取到有标签的 dom对象中 文本内容. 如果索引对象本身就是文本节点,则不好索引到, 没有相关的索引选择器. 例如: 对于<input>aaa ...

  4. DOM中元素节点、属性节点、文本节点

    DOM中有12中节点,但最常用到的是元素节点,属性节点,文本节点. 元素节点的节点类型(nodeType)是1: 属性节点的节点类型(nodeType)是2: 文本节点的节点类型(nodeType)是 ...

  5. DOM中元素节点、属性节点、文本节点的理解13.3

    节点信息 每个节点都拥有包含着关于节点某些信息的属性.这些属性是:nodeName(节点名称) nodeValue(节点值) nodeType(节点类型) nodeType nodeType 属性可返 ...

  6. DOM中元素节点,属性节点,文本节点的理解

    节点信息 每个节点都拥有包含着关于节点某些信息的属性.这些属性是: nodeName(节点名称) nodeValue(节点值) nodeType(节点类型) nodeType nodeType 属性可 ...

  7. DOM中的节点属性

    摘抄自:http://www.imooc.com/code/1589 nodeName 属性: 节点的名称,是只读的. 1. 元素节点的 nodeName 与标签名相同 2. 属性节点的 nodeNa ...

  8. JavaScript---网络编程(6)-Dom和Bom模型概念讲解(节点获取,window对象)

    本节讲Dom和Bom模型概念讲解(节点获取,window对象). out.js: 写了2个输出到页面的函数. function println(param){ document.write(param ...

  9. DOM中的NodeList与HTMLCollection

    最近在看<Javascript高级程序设计>的时候,看到了这样一句话:“理解NodeList和HTMLCollection,是从整体上透彻理解DOM的关键所在.”,所以觉得应该写一篇关于N ...

随机推荐

  1. PHP面试总结

    从8月15号来到北京一直到今天,一月有余.来的这段时间一直准备笔试面试,大大小小的公司,乱七八糟面了10多家,近期才安顿下来.面试的这段时间感觉自己成长了不少.初来到这个陌生的城市一脸茫然,不会乘地铁 ...

  2. js立即调用的函数表达式

    1.多种实现 // 下面2个括弧()都会立即执行 (function () { /* code */ } ()); // 推荐使用这个 (function () { /* code */ })(); ...

  3. ExtJs基础知识总结:Dom、IFrame和TreePanel、TabPanel(三)

    概述 ExtJs是另外一种操作封装JavaScript的类库与Jquery同类.所以对Dom的操作也是支持的,比如修改Div内Html内容等操作.有几个问题需要思考下: 1.ExtJs也支持IFram ...

  4. 1 Maximum Product Subarray_Leetcode

    Find the contiguous subarray within an array (containing at least one number) which has the largest ...

  5. WebAPI图片上传

    public Task<HttpResponseMessage> PostFormData() { // Check if the request contains multipart/f ...

  6. linux中redis的php扩展安装

    PHP中的扩展一般都是在安装环境的时候就已经装好了的.但是有的一些扩展在后期想要加上去的话也是可以的.php支持后期安装扩展. 想要安装扩展就需要先去下载安装扩展所需要的扩展源码包.autoconf. ...

  7. Json格式示意图

    json视图工具:http://www.bejson.com/jsonviewernew/ 一.Json格式化,(看到数组里面又有数组一下子疑问不是合格json):尾门地址查询: =>=> ...

  8. iOS 使点击事件穿透透明的UIView

    如图: 悬浮的三个按钮下方有一个可以点击的灰色区域,但是点击按钮之间的透明区域, 这三个按钮的contentView会响应这个点击事件,这时候需要让这个contentView不响应这个点击事件. 解决 ...

  9. 转载:安装ie driver和chrome driver

    很多同学在使用webdriver的时候总是忘了安装ie driver和chrome driver, 因此在这里简单介绍一下这2个driver的安装方式. IE driver 在新版本的webdrive ...

  10. CODEVS1090 加分二叉树

    codevs1090 加分二叉树 2003年NOIP全国联赛提高组 题目描述 Description 设一个n个节点的二叉树tree的中序遍历为(l,2,3,…,n),其中数字1,2,3,…,n为节点 ...