开启辅助访问
帐号登录 |立即注册

分别用Javascript和JQuery写选项卡对比

 
原生JS写法:
<script>
window.onload = function () {
var oDiv = document . getElementById('div1');
var aInput = oDiv . getElementsByTagName (' input');
var aCon = oDiv.getElementsByTagName ('div') ;
for (var i=0;i<aInput.1ength;i++){
aInput .index = i;
aInput . onclick = function() {
for (var i=0; i<aInput. length;i++)
{
aInput .className = ' ';
aCon .style.display = 'none' ;
}
this.className = 'active' ;
aCon[this. index] .style.display = 'block';
};
}
};
</script>

JQ的写法:
<script>
$ (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>

回复

使用道具 举报

0 个回复

倒序浏览

快速回复

您需要登录后才可以回帖 登录 or 立即注册

本版积分规则

友情链接
  • 艾Q网

    提供设计文章,教程和分享聚合信息与导航工具,最新音乐,动漫,游戏资讯的网站。