                        课程
                    
                        /前端开发
                        
                            /jQuery
                        
                        /jQuery基础课程

jquery学习

jquery的学习成果

十nian

2015-03-08

源自：jQuery基础课程 3-13

关注问题我要回答

408

操作

收起

1 回答

supper_alien
2015-12-19

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>挑战题</title>
<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js" type="text/javascript"></script>
<style>
.yincang{display:none;}
</style>
</head>

<body>
<ul>
<li class="yincang">这是第一个li</li>
<li class="yincang">这是第二个li</li>
<li>这是第三个li</li>
<li>这是第四个li</li>
<li>这是第五个li</li>
<li>这是第六个li</li>
<li>这是第七个li</li>
<a href="#" id="bian" onclick="showHidenCode()">更多</a>
</ul>
<script>
function showHidenCode(){
if($("#bian").html()=="更多"){
$("#bian").html("简化");
$("li:eq(0)").removeClass("yincang");
$("li:eq(1)").removeClass("yincang");
}else{
$("#bian").html("更多");
$("li:eq(0)").addClass("yincang");
$("li:eq(1)").addClass("yincang");
}
}

</script>
</body>
</html>