![](https://iknow-base.cdn.bcebos.com/lxb/notice.png)
网页代码js问题,求大神帮帮我,谢谢各位了,急!!!
想知道我的代码错在哪里了,我点击右边的三个按钮没有反应。<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><...
想知道我的代码错在哪里了,我点击右边的三个按钮没有反应。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <link rel="stylesheet" media="screen" href="member.css"> <script type="text/javascript"> function getClass(className) { var Tn = document.getElementsByTagName('*'); var Tna=[]; for (var i = 0; i < Tn.length; i++) { if (Tn[i].className.indexOf(className)>=0){ Tna[Tna.length] = Tn[i]; } } return Tna; } window.onload=function () { var Btn=getClass('b'); var Div=getClass('Sdiv'); var i; for(i=0;i<Btn.length;i++){ Btn[i].onclick=function () { var index=(this.getAttribute('index')-0); if(Btn[index].className.indexOf('Nowb')>=0)return; for(i=0;i<=Btn.length;i++){ if(index==i){ Btn[i].className='b Nowb'; Div[i].className='Sdiv NowSdiv'; }else{ Btn[i].className='b'; Div[i].className='Sdiv'; } } } } } </script></head><body><div id="nav"> <div id="logo"></div> <div id="navi"> <ul> <li> <a href="./index.html">首页</a> </li> <li> <a href="javascript:void(0);">部门介绍</a> </li> <li class="chose"> <a href="javascript:void(0);">成员概况</a> </li> <li> <a href="javascript:void(0);">近期活动</a> </li> <li> <a href="javascript:void(0);">资料分享</a> </li> </ul> </div> <label id="loadin">部员登录</label></div><div id="div1"> <div style="float: left" id="div2"> <div class="Sdiv NowSdiv">aaa</div> <div class="Sdiv">bbb</div> <div class="Sdiv">ccc</div> </div> <div > <img src="img/btn.jpg" class="b Nowb"> <img src="img/btn.jpg" class="b"> <img src="img/btn.jpg" class="b"> </div> </div></body></html>部分Css部分:#div1{ top:160px; position:relative;overflow:hidden;height:707px; width:1275px; margin: auto ;}#div2{ background-image: url("img/1.jpg"); height: 700px; width: 1200px; box-shadow: #888888 5px 5px 2px;}.Now_b{ margin-left: 0px!important; box-shadow: #888888 5px 5px 2px!important;}.b{ margin-left: 4px; cursor: pointer;}.divS{ position: absolute; display: none;}.Now_divS{ display: block!important;}
展开
1个回答
展开全部
大概看了一下,
发现getClass()传的参数是类名,然后函数里又写getElementsByTagName(),此为错误一
然后,即使是函数里用了getElementsByClassName(),会存在严重的浏览器兼容问题,因此应该用getElementById(),利用id来获取元素。
如果有学插件的话,比如jquery,获取,以及函数编写就不用那么麻烦了!特别是这种简单的操作
另外,开发过程中,遇到看不到效果的情况,应该首先是用控制台来解决,浏览器-按f12-控制台(controller),查看对应的错误提示!
如果不会调试,可私聊。
希望有所帮助
发现getClass()传的参数是类名,然后函数里又写getElementsByTagName(),此为错误一
然后,即使是函数里用了getElementsByClassName(),会存在严重的浏览器兼容问题,因此应该用getElementById(),利用id来获取元素。
如果有学插件的话,比如jquery,获取,以及函数编写就不用那么麻烦了!特别是这种简单的操作
另外,开发过程中,遇到看不到效果的情况,应该首先是用控制台来解决,浏览器-按f12-控制台(controller),查看对应的错误提示!
如果不会调试,可私聊。
希望有所帮助
![](https://ecmc.bdimg.com/public03/b4cb859ca634443212c22993b0c87088.png)
2024-08-21 广告
在北京引力弹弓科技有限公司,JavaScript是我们技术栈中不可或缺的一环。它赋予了我们网页动态交互的能力,使我们能够开发出既美观又高效的前端应用。我们利用JavaScript优化用户体验,通过异步请求、DOM操作、以及现代前端框架(如R...
点击进入详情页
本回答由MarsCode提供
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询