javascript原生dom操作方法
2016-02-25 10:27
489 查看
[b]一、节点层次属性[/b]
考虑空白符的相关层次关系属性:
1.childNodes属性 包含
2.parentNode属性
3.previouseSibling属性和nextSibling属性
4.firstChild属性和lastChild属性
不考虑空白符的相关层次关系属性:
1.children属性
2.childElementCount
3.firstElementChild
4.lastElementChild
5.previousElementSibling
6.nextElementSibling
二、动态操作节点
1.创建新节点:document.createElement()
2.添加子节点:父元素.appendChild()
3.插入新节点: 父元素.insertBefore(newNode,relNode)
4.替换节点:父元素.replaceChild(newNode,oldNode)
5.删除节点:父元素.removeChild(node)
6.克隆节点:节点.cloneNode() 传入true参数代表深度克隆,否则为浅克隆
三、节点查找
dom0级方法
document/父节点.getElementById()
document/父节点.getElementsByTagName()
document/父节点.getElementsByName()
dom扩展中还提供了以下方法:
querySelector()
querySelectorAll()
matchesSelector()
上述方法接收一个css选择符对象
四、常用节点的属性及操作
1.所有节点都具有NodeType属性,元素节点取值为1,属性节点为2,文本节点为3....
2.所有节点都具有nodeName,nodeValue属性,其取值根据节点类型不同而不同。对于元素节点,nodeName与tagName取值相同,都等于标签名
3.document节点常用属性有URL,forms,images等;另外可能涉及的方法有write(),writeln()
4.元素节点常用属性有:id,title,className,style等;常用方法有getAttribute(),setAttribute(),removeAttribute();要读取元素节点内部文本节点的内容(表单元素除外,其往往有更简便的方法),可以使用firstChild.data,或者innerHTML属性
5.表格操作有不同于常规dom操作的更简便的方法
6.表单元素操作也往往有不同于常规dom操作的更简便方法
五、节点滚动相关方法
1.节点.scrollIntoView()
2.节点.scrollIntoViewIfNeeded()
3.节点.scrollByLines()
4.节点.scrollByPages()
考虑空白符的相关层次关系属性:
1.childNodes属性 包含
2.parentNode属性
3.previouseSibling属性和nextSibling属性
4.firstChild属性和lastChild属性
不考虑空白符的相关层次关系属性:
1.children属性
2.childElementCount
3.firstElementChild
4.lastElementChild
5.previousElementSibling
6.nextElementSibling
二、动态操作节点
1.创建新节点:document.createElement()
2.添加子节点:父元素.appendChild()
3.插入新节点: 父元素.insertBefore(newNode,relNode)
4.替换节点:父元素.replaceChild(newNode,oldNode)
5.删除节点:父元素.removeChild(node)
6.克隆节点:节点.cloneNode() 传入true参数代表深度克隆,否则为浅克隆
三、节点查找
dom0级方法
document/父节点.getElementById()
document/父节点.getElementsByTagName()
document/父节点.getElementsByName()
dom扩展中还提供了以下方法:
querySelector()
querySelectorAll()
matchesSelector()
上述方法接收一个css选择符对象
四、常用节点的属性及操作
1.所有节点都具有NodeType属性,元素节点取值为1,属性节点为2,文本节点为3....
2.所有节点都具有nodeName,nodeValue属性,其取值根据节点类型不同而不同。对于元素节点,nodeName与tagName取值相同,都等于标签名
3.document节点常用属性有URL,forms,images等;另外可能涉及的方法有write(),writeln()
4.元素节点常用属性有:id,title,className,style等;常用方法有getAttribute(),setAttribute(),removeAttribute();要读取元素节点内部文本节点的内容(表单元素除外,其往往有更简便的方法),可以使用firstChild.data,或者innerHTML属性
5.表格操作有不同于常规dom操作的更简便的方法
6.表单元素操作也往往有不同于常规dom操作的更简便方法
五、节点滚动相关方法
1.节点.scrollIntoView()
2.节点.scrollIntoViewIfNeeded()
3.节点.scrollByLines()
4.节点.scrollByPages()
相关文章推荐
- JS对json对象的调用成员2种方式
- JSP界面全选删除
- JavaScript-1.最简单的程序之网页弹出对话框,显示为Warning---ShinePans
- 【HTML/JS】Pdf.js使用教程
- Js变量定义——fn里 var与不var的区别
- js刷新iframe页面的方法(兼容主流)
- JSP访问Hadoop 图片存储服务
- 写四个理解JS闭包的例子
- JS为表格每行添加点击事件
- 如何实现两个JSP数据的传输
- JSP 遍历ResultSet中的数据并转化为表格
- javascript高级编笔记第四章 第五章
- JS编程艺术笔记(3)-动态创建标记
- JS根据浏览器窗口大小实时动态改变网页文字大小的方法
- js 页面刷新location.reload和location.replace的区别小结
- maven编译找不到符号 sun.org.mozilla.javascript.internal
- js:string转int
- ztree 的简单json 的学习事例
- Json_encode防止汉字转义成unicode的方法
- 原生javascript实现addClass,removeClass,hasClass函数