求大神...

来源:2-9 jQuery选择器之可见性筛选选择器

qq_GreenOrRed_0

2016-09-06 23:19

<!DOCTYPE html>

<html>


<head>

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

    <title></title>

    <link rel="stylesheet" href="imooc.css" type="text/css">

    <script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script>

</head>


<body>

    <h2>可见性筛选选择器</h2>

    <h3>:visible/:hidden</h3>

    <div class="left">

        <div class="div">

            <a>display</a>

            <p id="div1" style="display:none;">display</p>

        </div>

        <div class="div">

            <a>width</a>

            <a>height</a>

            <p id="div2" style="width:0;height:0">width/height</p>

        </div>

        <div class="div">

            <a>visibility</a>

            <a>opacity</a>

            <p id="div3" style="visibility:hidden;opacity:0">visibility</p>

        </div>

    </div>


    <p id="show"></p>

<script type="text/javascript">

function show (ele) {

if (ele instanceof jQuery) {

$("#show").html('元素的长度的 = ' + ele.length)

} else {

document.write(ele+' 不是jQuery对象')

}

}

</script>



    <script type="text/javascript">

        //查找id = div1的DOM元素,是否可见

        show($("#div1:visible"));

    </script>


    <script type="text/javascript">

    //查找id = div2的DOM元素,是否可见

    show($("#div2:visible"));

    </script>


    <script type="text/javascript">

    //查找id = div3的DOM元素,是否可见

    show($("#div3:visible"));

    </script>


    <script type="text/javascript">

    //查找id = div1的DOM元素,是否隐藏

    show($("#div1:hidden"));

    </script>


    <script type="text/javascript">

    //查找id = div2的DOM元素,是否隐藏

    show($("#div2:hidden"));

    </script>


    <script type="text/javascript">

    //查找id = div3的DOM元素,是否隐藏

    show($('#div3:hidden'));

    </script>




</body>


</html>

这个里在慕课的右边只显示了第一个 

<script type="text/javascript">

        //查找id = div1的DOM元素,是否可见

        show($("#div1:visible"));

    </script>

后面的script都没有显示


写回答 关注

3回答

  • 大块吃肉188
    2016-09-09 10:00:53
    已采纳

    $("#show").html('元素的长度的 = ' + ele.length)注意这一句,用的是  .html( ) 的方法把内容写入。当用该方法设置一个值时,它会覆盖所有匹配的元素的内容。注意是“覆盖”,在这里是显示在id=show的元素($('#show')可知)中,因为你每次都是在同一个地方进行显示,后一次的内容会覆盖前一次的,和js中的document.write( )类似的感觉。新手,欢迎指正交流 

    qq_Gre... 回复大块吃肉18...

    大概了解了 谢谢啦

    2016-09-12 12:35:44

    共 5 条回复 >

  • 微笑Vlife
    2016-09-07 18:06:32

    下面写的这个覆盖了上面写的这条类似的语句,你输入一个 show($("#div3:visible")); 元素的长度就会变成1,就可以证明这一点了

    画方为圆 回复qq_Gre...

    因为下面的程序后运行啊。所以会覆盖啊。就跟赋值一样啊

    2016-12-16 11:11:01

    共 2 条回复 >

  • 仙士可
    2016-09-07 09:46:05

    js脚本不是这样写的。。。。。

    <script type="text/javascript">

       这里面可以包含所有的js代码,不用如你这样一段就写一句

        </script>


    qq_Gre...

    这个是慕课里的课程写的。。我没去改。。。我的问题是为什么才显示了一个script?按道理,多个script也会一个一个显示的呀??

    2016-09-07 13:38:01

    共 1 条回复 >

jQuery基础 (一)—样式篇

jQuery初入开启样式修炼,体验万能的jQuery样式集搭建网站布局

217509 学习 · 1218 问题

查看课程

相似问题