javaScript中childNodes、children的用法几则

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE>childNodes Method Test</TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
</HEAD>


<BODy onLoad="aaa();">
<div id="tupian"><table cellpadding="0" cellspacing="1" border="0" width="100%" id="table1">
<tr id="tr1">
<td id="td1">
<a target="_self" href="http://211.155.231.109/Files/20074299389594.jpg" title="杭州桃花源远景" id="1">
<img border="0" src="http://211.155.231.109/Files/20074299389594.jpg" width="94" height="71"></img>
</a>
<p id='p123'>
<a target="_self" href="http://211.155.231.109/Files/20074299389594.jpg" title="杭州桃花源远景3" id="2">
<img border="0" src="http://211.155.231.109/Files/20074299389594.jpg" width="94" height="71"></img>
</a>
</p>
</td>

<td id="td2">
<a target="_self" href="http://211.155.231.109/Files/20074299389594.jpg" title="桃花源实景图例2">
<span>123</span>
<span>222</span>
</a>
</td>
</tr>
</table>
</div>
<SCRIPT LANGUAGE="JavaScript">
<!--
function aaa(){
// alert(document.all['tupian'].childNodes[0].id); //用childNodes取得div子标签对象id
var h = document.all['tupian'].childNodes[0]; //取得id为“tupian”的div子对象
// alert(h.rows[0].id); //取得table的行[0]id
// alert(h.rows[0].childNodes[0].id);
// alert(h.rows[0].cells[0].childNodes[0].childNodes[0].src); //第一行第一列A标签下的IMG标签src
// var l = h.rows[0].cells[0].childNodes.length; //childNodes中间有两个并列的双标记标签时,可用childNodes[i]取得对象
// for(var i=0;i<l;i++){
// alert(i);
// alert(h.rows[0].cells[0].childNodes[i].tagName);
// }
// alert(h.rows[0].cells[0].childNodes[0].childNodes[0].tagName); //取IMG的tagname
// alert(h.rows[0].cells[1].id); //第一行第二列ID
var w =h.rows[0].cells[1].childNodes[0].childNodes.length; //children和childNodes区别:children只取HTML,它者取HTML和包含文本innerHTML;
alert(w);
alert(h.rows[0].cells[1].childNodes[0].tagName);
for(var j=0;j<w;j++){
alert(j);
alert(h.rows[0].cells[1].childNodes[0].childNodes[j].tagName);
}
}
//上述打出的tagName有4个,因为有\t或者回车或者空格等元素存在。childNodes是会将这些元素读取进去。如果是一行则正确。
//在DOM中childNodes共5个节点类型:Element,Text,Attr,Comment,CDATASection。可用childNodes[i].nodeType == ELEMENT 对childNodes进行过滤.
//如果将childNodes[j]替换成children就不会出现这些问题。
//-->
</SCRIPT>
</BODY>
</HTML>
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值