为什么出错了

为什么出错了

显示getElementsByTagName错误

  1. <!DOCTYPE html>


  2. <html>

  3. <head>

  4. <meta charset="UTF-8">

  5. <title>综合实例</title>

  6. <link rel="stylesheet" type="text/css" href="css/lunbo.css">

  7. </head>

  8. <body>

  9. <div class="main" id="main">

  10. <div class="banner" id="banner">

  11. <a href="">

  12. <div class="banner-slide slide1 slide-active"></div>

  13. </a>

  14. <a href="">

  15. <div class="banner-slide slide2"></div>

  16. </a>

  17. <a href="">

  18. <div class="banner-slide slide3"></div>

  19. </a>

  20. </div>

  21. <!--上一张、下一张按钮-->

  22. <a href="" class="button prev"></a>

  23. <a href="" class="button next"></a>

  24. <!--圆点导航-->

  25. <div class="dots">

  26. <span class="active"></span>

  27. <span></span>

  28. <span></span>

  29. </div>

  30. </div>

  31. <script type="text/javascript" src="js/javascript.js"></script>

  32. </body>

  33. </html>


  34. *{

  35. margin: 0;

  36. padding: 0;

  37. }

  38. ul{

  39. list-style: none;

  40. }


  41. body{

  42. font-family: "微软雅黑";

  43. color: #14191e;


  44. }


  45. .main{

  46. width: 1200px;

  47. height: 460px;

  48. margin: 30px auto;

  49. overflow: hidden;

  50. position: relative;

  51. }


  52. .banner{

  53. width: 1200px;

  54. height: 460px;

  55. overflow: hidden;

  56. position: relative;

  57. }


  58. .banner-slide{

  59. width: 1200px;

  60. height: 460px;

  61. background-repeat: no-repeat;/*图片只显示一次*/

  62. position: absolute;

  63. display: none;

  64. }


  65. .slide1{

  66. background-image: url(../img/bg1.jpg);

  67. }


  68. .slide2{

  69. background-image: url(../img/bg2.jpg);

  70. }


  71. .slide3{

  72. background-image: url(../img/bg3.jpg);

  73. }


  74. .slide-active{

  75. display: block;

  76. }


  77. .button{

  78. position: absolute;

  79. width: 40px;

  80. height: 80px;

  81. left: 244px;

  82. top: 50%;

  83. margin-top: -40px;

  84. background: url(../img/arrow.png) no-repeat center center;


  85. }


  86. .button:hover{

  87. background-color: #333;/*background-color只改变背景颜色不改变已有的背景*/

  88. opacity: 0.8;

  89. filter: alpha(opacity=0.8);

  90. }


  91. .prev{

  92. transform: rotate(180deg);

  93. }


  94. .next{

  95. left:auto;

  96. right: 0px;

  97. }


  98. .dots{

  99. position: absolute;

  100. bottom: 24px;

  101. right: 20px;

  102. text-align: right;

  103. }


  104. .dots span{

  105. display: inline-block;/*让圆点水平方向排列*/

  106. height: 12px;

  107. width: 12px;

  108. line-height: 12px;/*居中对齐*/

  109. border-radius: 50%;

  110. background: rgba(7,17,27,0.4);

  111. box-shadow: 0 0 0 2px rgba(255,255,255,0.8)inset;/*设置锚边*/

  112. margin-left: 8px;

  113. cursor: pointer;/*让光标变为手型*/

  114. }


  115. .dots span .active{

  116. box-shadow: 0 0 0 2px rgba(7,17,27,0.4)inset;

  117. background: #fff;

  118. }


  119. function byId(id) {

  120. return typeof(id) === "String" ? document.getElementById(id) : id;


  121. }


  122. var index = 0;

  123. var timer = null;

  124. pics=byId("banner").getElementsByTagName("div");

  125. len=pics.length;

  126. console.log(len);

  127. function slideImg() {

  128. var main = byId("main");

  129. main.onmouseover = function() {

  130. //滑过清除定时器

  131. }

  132. main.onmouseout = function() {

  133. timer = setInterval(function() {

  134. index++;

  135. console.log(index);

  136. }, 3000);

  137. }


  138. }

  139. slideImg();



正在回答 回答被采纳积分+1

登陆购买课程后可参与讨论,去登陆

2回答
好帮手慕柯南 2019-08-23 09:49:01

同学你好!

1、这里是string其实是一个值为string的字符串,并不是String类型

2、报getElementsByTagName is not a function是因为只是元素才能够调getElementsByTagName ,而同学的 byId(id) {}函数有误,导致无法正确通过id来获取元素。所以报了这个错。

如果我的回答解决了你的疑惑,请采纳,祝学习愉快~

好帮手慕阿满 2019-08-22 17:17:53

同学你好,byId()函数中,string应该是小写,如:

http://img1.sycdn.imooc.com//climg/5d5e5dbb00013bb506420103.jpg

如果我的回答解决了你的疑惑,请采纳。祝:学习愉快~

  • 提问者 慕后端2033046 #1
    真的耶!我都没注意到。。。可是为什么是小写呢我记得Java中string类是大写啊?另外它的报错是getElementsByTagName is not a function老师能不能给我分析一下这是什么意思啊为什么会在这里报错呢?谢谢
    2019-08-22 20:32:34
问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星
请稍等 ...
意见反馈 帮助中心 APP下载
官方微信

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师