关于document.getElementsByTagName的取值问题

此文转自:http://www.cnblogs.com/shoupifeng/archive/2009/11/13/1600906.html


这段时间,由于工作,所以要接触js,由于文件的命名出现了**-**.**中间出现了横杠,所以我就想用document.getElementsByTagName来取动态生成的<li>里面的value值了,但是奇怪的问题就出现了,调试只出现**,后面的-**.**这部分就取不到了(请看下面的小demo),我就奇怪了,后来在雷兔群问了一下,终于解决了

 

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>

<body>
<div>
<ul id="loading">
<li value="21_1">21-113123123</li>
<li value="21_2">21-212312312321</li>
<li value="21_3">21-3</li>
<li value="21_4">21-4</li>
<li value="21_5">21-5</li>
<li value="21_6">21-6</li>
<li value="21_7">21-7</li>

</ul>
<input name="" type="button"  value="点击触发"onClick="onlon()">
</div>
<script type="text/javascript">
function onlon(){
var ta = document.getElementById("loading");
var t = ta.getElementsByTagName('li');
var len = t.length;
for(i=0; i < len; i++){
  alert(t[i].value);
 
  }
}
</script>
</body>
</html>

 

 

//

原因就在<li>里面的value的属性,因为浏览器会将value的值直接用parsetInt转一下的,所以搞的后面那部分就取不到了,只要改了后面的value的名字,再用getAttribute()输出就好了

所以该证以上错误,就有了下面的代码:

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>

<body>
<div>
<ul id="loading">
<li val="21_1">21-113123123</li>
<li val="21_2">21-212312312321</li>
<li val="21_3">21-3</li>
<li val="21_4">21-4</li>
<li val="21_5">21-5</li>
<li val="21_6">21-6</li>
<li val="21_7">21-7</li>

</ul>
<input name="" type="button"  value="点击触发"onClick="onlon()">
</div>
<script type="text/javascript">
function onlon(){
var ta = document.getElementById("loading");
var t = ta.getElementsByTagName('li');
var len = t.length;
for(i=0; i < len; i++){
  alert(t[i].getAttribute('val'));
 
  }
}
</script>
</body>
</html>

 

~~~~呵呵,不知道算不算问题的自我发现呢·~~
  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值