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

哪位帅哥能帮忙看看? $("div:empty").text(":empty").css("border", "3px groove red"); 为什么这个没有效果呢? ​

<!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>:contains/:has</h3>

    <div class="left">

        <div class="div">

            <p>contains</p>

        </div>

        <div class="div">

            <p>contains</p>

        </div>

        <div class="div">

            <p>

                <span>:has</span>

            </p>

        </div>

        <div class="div">

            <p>:contains</p>

        </div>

    </div>


    <script type="text/javascript">

        //查找所有class='div'中DOM元素中包含"contains"的元素节点

        //并且设置颜色

   $(".div:contains(':contains')").css("color","red")

    </script>


    <script type="text/javascript">

        //查找所有class='div'中DOM元素中包含"span"的元素节点

        //并且设置颜色

        $(".div:has(p)").css("color", "blue");

    </script>



    <h3>:parent/:empty</h3>

    <div class="left">

        <div class="aaron">

            <a>:parent</a>

        </div>

        <div class="aaron">

            <a>:parent</a>

        </div>

        <div class="aaron">

            <a>:parent</a>

        </div>

        <div class="aaron">

           

        </div>

    </div>

    <script type="text/javascript">

       //选择所有包含子元素或者文本的a元素

       //增加一个蓝色的边框

       $("a:parent").css("border", "3px groove blue");

    </script>


    <script type="text/javascript">

       //找到a元素下面的所有空节点(没有子元素)

       //增加一段文本与边框

      $("div:empty").text(":empty").css("border", "3px groove red"); 

    </script>


</body>


</html>


正在回答

6 回答

$(".div:contains(':contains')").css("color","red") //句末差个分号 ;

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

一楼二楼四楼正解,空格也算一个文本节点

0 回复 有任何疑惑可以回复我~
 <div class="aaron">
           
        </div>

在这里你少了一个标签,应该是这样的

        <div class="aaron">
            <a></a>
        </div>

少了一个a标签,

$("div:empty").text(":empty").css("border", "3px groove red");

这句话中的.text(":empty")要给他值的,不知道是不是这个问题

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

换成        <div class="aaron"></div>试试就能有效果了。这时应该你        <div class="aaron">

</div>有文本节点,不满足:empty的筛选,所以才没有效果的

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

$("div:empty")的意思是选择没有子元素的元素(包含文本节点),在这个例子中,通常来讲

 <div class="aaron">

           </div>

就是符合没有子节点的元素,但是不其然,在html中空格也代表文本节点,所以就找不到没有字元素的节点,

如果想成功的话,去掉中间空格 <div class="aaron"></div>,这样就可以了



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

 <div class="aaron">

           

        </div>

这段代码不可以加空格

<div class="aaron"></div>



1 回复 有任何疑惑可以回复我~
#1

考拉汪汪

不错的
2017-04-27 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消

哪位帅哥能帮忙看看? $("div:empty").text(":empty").css("border", "3px groove red"); 为什么这个没有效果呢? ​

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