能不能帮我看看代码呀,我一运行就把慕课网给卡死了

来源:10-1 编程挑战

yu_1010

2019-03-19 09:28

<!DOCTYPE html>

<html>

<head>

    <meta charset="UTF-8">

    <title>实践题 - 选项卡</title>

    <style type="text/css">

     /* CSS样式制作 */  

     a{

         text-decoration:none;

         color:white;

     }

      ul

      {

        list-style-type: none;

        margin: 0;

        padding: 0;

        overflow: hidden;

        background-color: #333;

        width:70%;

      }

      li {

         float: left; 

         display: block;

         color: white;

         text-align: center;

         padding: 14px 16px;

         text-decoration: none;

      }

      .tab_text_init{

          display:none;

      }

      .tabshow

      {

         width:70%;

         border-style:solid;

      border-width:1px;

      border-color:green;

      border-top-color:white;

      }

      .tab_li_choose

      {

          background-color: #4CAF50;

      }

    </style>

    <script type="text/javascript">

      // JS实现选项卡切换

      //鼠标移动效果

    window.onload=function(){

        var tabs=document.getElementsByTagName("li");

        for(i=1;i<tabs.length;i++)

        {

            tabs[i].onmouseover=function(){

                this.style.backgroundColor="red";

            }

            tabs[i].onmouseout=function(){

                this.style.backgroundColor="#333";

            }

        }

    }

    

    function tab_change_click(em)

    {

       

        var tabs=em.parentNode;

        var ids=em.id;

        var id_temp=ids+"_p";

        var obj=document.getElementsByTagName("p");

        var li_obj=document.getElementsByTagName("li");

        for(var n=0;n<li_obj.length;i++)

        {

            li_obj[n].className="";

        

        }

        em.className="tab_li_choose";

        for(var i=0;i<obj.length;i++)

        {

            if(id_temp==obj[i].id)

            {

                obj.className="";

            }

            else

            {

                obj.className="tab_text_init";

            }

        

        }

        

    }

    

    </script>

 

</head>

<body>

<!-- HTML页面布局 -->

<ul>

    <li id="house" class="tab_li_choose" onclick="tab_change_click(this)">房产</li>

    <li id="Furnish" onclick="tab_change_click(this)">家居</li>

    <li id="houseold" onclick="tab_change_click(this)">二手房</li>

</ul>

<div id="tabshow" class="tabshow">

    <p id="house_p" >275万购昌平邻铁三居 总价20万买一居

    200万内购五环三居 140万安家东三环

    北京首现零首付楼盘 53万购东5环50平

    京楼盘直降5000 中信府 公园楼王现房<p>

    <p id="Furnish_p" class="tab_text_init">40平出租屋大改造 美少女的混搭小窝

     经典清新简欧爱家 90平老房焕发新生

     新中式的酷色温情 66平撞色活泼家居

     瓷砖就像选好老婆 卫生间烟道的设计<p>

    <p id="houseold_p" class="tab_text_init">通州豪华3居260万 二环稀缺2居250w甩

     西3环通透2居290万 130万2居限量抢购

     黄城根小学学区仅260万 121平70万抛!

     独家别墅280万 苏州桥2居优惠价248万<p>

</div>

 

</body>

</html>


写回答 关注

1回答

  • 慕盖茨2414040
    2019-05-08 11:37:09

    看了。你的不显示

JavaScript进阶篇

本课程从如何插入JS代码开始,带您进入网页动态交互世界

468726 学习 · 22053 问题

查看课程

相似问题