为了账号安全,请及时绑定邮箱和手机立即绑定

区别getElementByID,getElementsByName,getElementsByTagName这一课的问题

区别getElementByID,getElementsByName,getElementsByTagName这一课的问题

freefox 2016-03-30 18:40:35
<!DOCTYPE HTML> <html>     <head>         <meta http-equiv="Content-Type" content="text/html; charset=gb2312">         <title>无标题文档</title>     </head>          <body>         <form>           请选择你爱好:<br>           <input type="checkbox" name="hobby" id="hobby1">  音乐           <input type="checkbox" name="hobby" id="hobby2">  登山           <input type="checkbox" name="hobby" id="hobby3">  游泳           <input type="checkbox" name="hobby" id="hobby4">  阅读           <input type="checkbox" name="hobby" id="hobby5">  打球           <input type="checkbox" name="hobby" id="hobby6">  跑步 <br>           <input type="button" value = "全选" onclick = "checkall();">           <input type="button" value = "全不选" onclick = "clearall();">           <p>请输入您要选择爱好的序号,序号为1-6:</p>           <input id="wb" name="wb" type="text" >           <input name="ok" type="button" value="确定" onclick = "checkone();">         </form>         <script type="text/javascript">         function checkall(){             var hobby = document.getElementsByTagName("input");                       // 任务1            for (var i=0;i<hobby.length;i++)            {               hobby[i].checked=true;            }         }         function clearall(){             var hobby = document.getElementsByName("hobby");                       // 任务2            for (i=0;m<hobby.length;i++)            {               hobby[i].checked=false;            }                      }                  function checkone(){             var j=document.getElementById("wb").value;                   // 任务3          if (j<7&&j>0)          {             hobby[j-1].checked=true;          }         else         {             alert("wrong num.");         }         }                  </script>     </body> </html>代码如上主要是倒数几行任务3的问题(48-54),j可以实现else部分,就是说明他是整数,为什么上面if不能实现?我看高手有2个答案其一是类型转换 var hobby=document.getElementsByName("hobby");             hobby[parseInt(j)-1].checked=true;不是已经是数字类型吗?我这里不是很明白。第二我压根没看懂”charat()“这里面有什么技巧和讲究吗?这个是排名第一的回答,我查了M3Cschool也没能看明白,希望高手指点一下,先谢谢了! for(var n=0;n<j.length;n++){                                             hobby[(j.charAt(n))-1].checked=true;                  }
查看完整描述

2 回答

已采纳
?
qq_冲哥_0

TA贡献40条经验 获得超30个赞

1, 你的问题主要在文本框返回值的问题:文本框返回值是字符串,而不是数字,你的理解有问题。

var j=document.getElementById("wb").value;    你获取的是一个文本框的里面的值,文本框返回的值就是字符串。

执行else并不能说明 j 是一个整数,因为在这里执行隐式类型转化。如 "4"<7返回的也是true, 但你能说明 字符串"4" 是整数吗?

同样你的程序只所以能够执行,也是隐式类型转化,  “4”-3 ==1 ; 字符串"4"转化为数字,所有在做算术运算时,都要进行显示类型转化。parseInt(j


charAt(n)是返回字符串位于n索引的字符,"4".length 返回1, "4".charAt(0)就是返回字符"4", 

 for(var n=0;n<j.length;n++){

                        hobby[(j.charAt(n))-1].checked=true; 

  }

j 是1-6,比如是4, 它是字符串"4",如上所述, j.length = 1, n 只能取0, j.charAt(n)) 就是"4".charAt(0),他返回字符"4", 此后还要隐式类型转化, “4”-1 = 3, 第四个阅读 选中。


个人认为,用循环是最差的,循环要两次,最大的问题是循环之后还要隐式类型转化,和没有用循环没有区别。

 hobby[parseInt(j)-1]  最好,当然不用也可以

查看完整回答
反对 回复 2016-03-31
?
卖火柴的小舒

TA贡献42条经验 获得超16个赞

//img1.sycdn.imooc.com//56fc88ed0001f47019200891.jpg

我没怎么看明白你的表述。复制你的代码在浏览器里面试了试,看到之所以没选中的原因是报错"hobby is not defined",也就是说hobby这个变量没有定义,我看了一下你的声明。  var hobby = document.getElementsByTagName("input");这一句应该写在checkall函数外面,你那样写这个变量的作用范围只在checkall函数里,其它的函数是找不到这个变量的。

至于第二个问题,我只能告诉你“charAt() 方法可返回指定位置的字符。”没看到完整的代码我也说不出具体的作用!

查看完整回答
反对 回复 2016-03-31
  • freefox
    freefox
    上面的代码就是我看的课程的全部。
  • 2 回答
  • 0 关注
  • 1831 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信