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 | 下一个紧邻的元素节点, |
谷歌和火狐都可以获得下一个紧邻的元素节点, |
|
previousSibling | 上一个紧邻节点 | 上一个紧邻节点,chrome 火狐都支持的,只不过呢,有可能 会获得文本节点,IE8及之前的浏览器会忽略空白文本节点,如果文本有内容,也会获得到 | |
previousElementSibling | 上一个紧邻的元素节点 |
谷歌和火狐都可以获得上一个紧邻的元素节点, |
|
克隆节点 | 节点.cloneNode(true) | 复制节点中的全部包括文本 标签元素 | |
节点.cloneNode(false) | 自复制节点标签 | ||
删除节点 | 父元素.removechild(要删除的子元素) |
增加节点 |
父节点.appendChild (新生成的子节点) |
在父元素最后增加 | |
父节点.insertBefore (新生成的子节点,某个子节点) 在某个子节点前增加 新生成的子节点 |
在某个子元素前增加 |
5动态创建节点
dom中一些节点获取和增改的更多相关文章
- DOM中元素节点、属性节点、文本节点的理解
DOM中元素节点.属性节点.文本节点的理解 节点信息 每个节点都拥有包含着关于节点某些信息的属性.这些属性是:nodeName(节点名称) nodeValue(节点值) nodeType(节点类型) ...
- javascript DOM中的节点层次和节点类型概述
针对JS高级程序设计这本书,主要是理解概念,大部分要点源自书内.写这个主要是当个笔记加总结 存在的问题请大家多多指正! 因为DOM这方面的对象方法操作性都特别强,但是逻辑很简单,所以就没有涉及到实际的 ...
- DOM中文本节点索引方法
问题 对于 jquery 接口text()只能取到有标签的 dom对象中 文本内容. 如果索引对象本身就是文本节点,则不好索引到, 没有相关的索引选择器. 例如: 对于<input>aaa ...
- DOM中元素节点、属性节点、文本节点
DOM中有12中节点,但最常用到的是元素节点,属性节点,文本节点. 元素节点的节点类型(nodeType)是1: 属性节点的节点类型(nodeType)是2: 文本节点的节点类型(nodeType)是 ...
- DOM中元素节点、属性节点、文本节点的理解13.3
节点信息 每个节点都拥有包含着关于节点某些信息的属性.这些属性是:nodeName(节点名称) nodeValue(节点值) nodeType(节点类型) nodeType nodeType 属性可返 ...
- DOM中元素节点,属性节点,文本节点的理解
节点信息 每个节点都拥有包含着关于节点某些信息的属性.这些属性是: nodeName(节点名称) nodeValue(节点值) nodeType(节点类型) nodeType nodeType 属性可 ...
- DOM中的节点属性
摘抄自:http://www.imooc.com/code/1589 nodeName 属性: 节点的名称,是只读的. 1. 元素节点的 nodeName 与标签名相同 2. 属性节点的 nodeNa ...
- JavaScript---网络编程(6)-Dom和Bom模型概念讲解(节点获取,window对象)
本节讲Dom和Bom模型概念讲解(节点获取,window对象). out.js: 写了2个输出到页面的函数. function println(param){ document.write(param ...
- DOM中的NodeList与HTMLCollection
最近在看<Javascript高级程序设计>的时候,看到了这样一句话:“理解NodeList和HTMLCollection,是从整体上透彻理解DOM的关键所在.”,所以觉得应该写一篇关于N ...
随机推荐
- Swift - 代码创建NSLayoutConstraint布局
NSLayoutConstraint参数说明: /** * 创建约束 NSLayoutConstraint 参数 说明: * item 自己 * attribute * relatedBy 大于等于 ...
- HTML5窗口间同域和跨域的通信
一丶同域下的 1.如果我们要操作iframe里面的元素,首先获取到引入的页面的window.获取iframe里面的window对象. var oIframe=getElementsByTagName( ...
- 攻城狮在路上(陆)-- hadoop分布式环境搭建(HA模式)
一.环境说明: 操作系统:Centos6.5 Linux node1 2.6.32-431.el6.x86_64 #1 SMP Fri Nov 22 03:15:09 UTC 2013 x86_64 ...
- 如何在一个页面上让多个jQuery
如何在一个页面上让多个jQuery共存呢?比如jquery-1.5和jquery-1.11. 你可能会问,为什么需要在一个页面上让多个jQuery共存?直接引用最新版本的jQuery不行吗? 答案是, ...
- UWP学习记录1-开端
UWP学习记录1-开端 1.背景 针对不同基础的人,学习的路线自然是不同的.这篇文章记录的是我个人的学习路线,或者说笔记.我对自己的技术状态的定义是: A.有很好的windows平台编程基础: B.有 ...
- java调用sqlldr oracle 安装的bin目录
package com.jyc.sqlldr; import java.io.BufferedReader;import java.io.InputStream;import java.io.Inpu ...
- 【MongoDB初识】-其他操作
又发现一种查询写法$wheredb.class.find({$}}) 排重db.class.distinct("stuCount") 一.MapReduce(摘录MongoDB实战 ...
- http tcp udp ip 间的关系
首先,我自己梳理一下,其实除了应对以后的笔试,还有需要应对的是自己在编程中对于api的选择,我在满足需求时采取哪种方案更好. 首先,我需要了解的是tcp/ip是一个协议组,有三大层: ip 对应于网络 ...
- mac安装java8
http://stackoverflow.com/questions/24342886/how-to-install-java-8-on-mac brew tap caskroom/cask brew ...
- webdav不识别软链接?解决办法?
webdav不识别软链接?解决办法? 在使用webdav实现公网存储共享的时候,发现webdav并不支持软链接的共享,如下源代码可以100%确定这个问题 /* ### for now, only pr ...