小程序正式发布_原生JS与jQuery编写简略选项卡

摘要: 原生态JS与jQuery撰写简易选择项卡 本文关键为大伙儿详尽详细介绍了原生态JS与jQuery撰写简易选择项卡,具备一定的参照使用价值,很感兴趣的小伙子伴们能够参照一下style type="...

原生JS与jQuery编写简单选项卡       这篇文章主要为大家详细介绍了原生JS与jQuery编写简单选项卡,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
style type="text/css" #div1 div{width: 200px;height: 200px;border: 1px red solid;display: none;} .active{background:#999;} /style !-- 原生的JS -- script type="text/javascript" window.onload=function(){ var oDiv=document.getElementById('div1'); var aInput=document.getElementsByTagName('input'); var aCon=oDiv.getElementsByTagName('div'); for (var i = 0; i aInput.length; i++) { aInput[i].index=i; aInput[i]. unction(){ for (var i = 0; i aInput.length; i++) { aInput[i].className=''; aCon[i].style.display=''; this.className='active'; aCon[this.index].style.display='block'; /script
!-- jquery写法 -- script type="text/javascript" src='../jquery-3.2.1.min.js' /script script type="text/javascript" $(function(){ $('#div1').find('input').click(function(){ $('#div1').find('input').attr('class',''); $('#div1').find('div').css('display','none'); $(this).attr('class','active'); $('#div1').find('div').eq($(this).index()).css('display','block'); /script /head body div id="div1" input type="button" value="1" input type="button" value="2" input type="button" value="3" div 11111 /div div 22222 /div div 33333 /div /div /body /html

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持凡科。




联系我们

全国服务热线:4000-399-000 公司邮箱:343111187@qq.com

  工作日 9:00-18:00

关注我们

官网公众号

官网公众号

Copyright?2020 广州凡科互联网科技股份有限公司 版权所有 粤ICP备10235580号 客服热线 400-000-8888