DOM
来源:互联网 发布:php怎么找工作 编辑:程序博客网 时间:2024/06/18 18:23
父节点、子节点
节点类型:元素节点、属性节点、文本节点、注释节点、document节点
nodeType属性:查看节点类型
返回值:1-->元素节点
2-->属性节点
3-->文本节点
8-->注释节点
9-->document节点
nodeName属性:查看节点名称
nodeValue属性:查看节点的值
childNodes(标准属性):子节点
在ie9(包括ie9)以上及标准浏览器,会把标签的换行作为空白文本节点。
children(非标准属性):子节点 无兼容性问题
实例1:布局符合标签嵌套规则
<ul id="ul1">
<script>
var oUl = document.getElementByIdx_x('ul1');
var aLi = oUl.children; //非标准属性
alert( aLi.length ); // ie6/7/8 --> 5; 标准--> 5
alert( aLi[0].nodeType ); // ie6/7/8 --> 1; 标准--> 1
alert( oUl.nodeName ); // ul
alert( oUl.nodeValue ); // null
alert( oUl.nodeType ); // 1
for(var i=0; i<aLi.length; i++){
if(aLi[i].nodeType === 1){ //判断是不是元素节点
aLi[i].style.background = 'red';
}
}
</script>
实例2:布局不符合标签嵌套规则
<ul id="ul1">
<script>
var oUl = document.getElementByIdx_x('ul1');
var aLi = oUl.childNodes; //标准属性
alert( aLi.length ); // ie6/7/8 --> 5(未算标签<p>); 标准--> 13(算标签<p>)
alert( aLi[0].nodeType ); // ie6/7/8 --> 1; 标准--> 3
var aLi = oUl.children; //非标准属性
alert( aLi.length ); // ie6/7/8 --> 5(未算标签<p>); 标准--> 6(算标签<p>)
alert( aLi[0].nodeType ); // ie6/7/8 --> 1; 标准--> 1
alert( oUl.nodeName ); // ul
alert( oUl.nodeValue ); // null
alert( oUl.nodeType ); // 1
for(var i=0; i<aLi.length; i++){
if(aLi[i].nodeType === 1){ //判断是不是元素节点
aLi[i].style.background = 'red';
}
}
</script>
阅读全文
0 0
- DOM
- DOM
- dom
- dom
- DOM
- dom
- DOM
- DOM
- DOM
- DOM
- DOM
- dom
- dom
- Dom
- dom
- DOM
- DOM
- DOM
- MapReduce实例----排序
- eclipse debug启动很慢
- NYOJ 125 盗梦空间
- http协议讲解
- flash---星星闪
- DOM
- CodeForces 787A A. The Monster(扩展欧几里得)
- codeforces 811 E Vladik and Entertaining Flags(线段树+并查集)
- Lua:ipairs/pairs
- npm
- POJ1321-回溯+DFS
- caffe openpose/Realtime Multi-Person 2D Pose Estimation using Part Affinity Fields配置
- 【已解决】开发模式下,微信公众号自定义菜单显示不全
- UnicodeDecodeError: ‘ascii’ codec……not in range(128)