jquery的$

<!DOCTYPE HTML>
<HTML>
    <head>
         <title>aa</title>
         <script type="text/javascript" src="jquery.js"></script>
         <style type="text/css">
         body,div{padding: 0;margin: 0;}
         .border{border:1px dashed #ccc;}
         .red{background:#f00;}
         </style>
         <script type="text/javascript">
             $(function(){
                 $("#test").click(function(){
                     $('.mydiv>ul').addClass("red");
                     //$('.mydiv ul').addClass("red");
                 });
             });
         </script>
    </head>
<body>
    <div class="mydiv">
        <ul>
            <li>asadfasdfsd</li>
            <li>asadfasdfsd</li>
            <li>asadfasdfsd</li>
            <li>asadfasdfsd</li>
        </ul>
        <p class="border"></p>
        <div><ul>
            <li>asadfasdfsd</li>
            <li>asadfasdfsd</li>
            <li>asadfasdfsd</li>
            <li>asadfasdfsd</li>
        </ul></div>
        <p class="border"></p>
        <input type="button" value="test" id="test"/>
    </div>
</body>
</HTML>

点击后出现的效果是：

jquery的$

所以，$('.mydiv>ul')是指直接后代里找<ul>，只找姓ul的儿子，但是孙子不管了

$('.mydiv>ul')是指所有后代里找<ul>。（则会两个ul都会出现红色背景）

相关文章