为了账号安全,请及时绑定邮箱和手机立即绑定

完整版代码

感觉不是最优的,显示隐藏那里

正在回答

2 回答

<!DOCTYPE html>

<html>

    <head>

        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

          <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js" type="text/javascript"></script>

        <script type="text/javascript">

            $(function(){

             $("a").click(function(){

                if($("a").text()==="更多"){

                    $("a").text("简化");

                    $("li:eq(3)").css("display","none");

                    $("li:eq(4)").css("display","none");

                }

                else{

                    $("a").text("更多");

                    $("li:eq(3)").css("display","list-item");

                    $("li:eq(4)").css("display","list-item");

                }

             }) 

            })

         

        </script>

        <title>挑战题</title>

    </head>

      

    <body>

    <ul>

        <li>11111</li>

        <li>22222</li>

        <li>33333</li>

        <li>44444</li>

        <li>55555</li>

        <li>66666</li>

        <li>77777</li>

        <a href="#">更多</a>

    </ul>

        

    </body>

</html>


0 回复 有任何疑惑可以回复我~

<!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>
</head>

<body>
<ul>
 <li>1</li>
 <li>2</li>
 <li>3</li>
 <li>4</li>
 <li>5</li>
 <li>6</li>
 <li>7</li>
 <li>8</li>
</ul>
<a href="#">更多</a>
<script>
 $("li:gt(3):not(:last)").hide();
 $("a").click(function(){
   if($("a").html()==="更多"){
     $("a").html("简化");
     $("ul li").show();
   }else{
     $("a").html("更多");
     $("li:gt(3):not(:last)").hide();
   }
 })
</script>
</body>
</html>

0 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消
jQuery基础课程
  • 参与学习       154768    人
  • 解答问题       7184    个

加入课程学习,有效提高前端开发速度

进入课程

完整版代码

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信