jquery选择器 

<body>
<div>hello</div>
<p id="p1" alex="tom">ppp</p>
<a href="">click</a>
<div class="outer">outer
    <div class="inner">inner</div>
</div>

<div class="outer">outer
    <div class="inner">inner
    <p>tom</p></div>
    <p>jerry</p>
</div>
<p>sadf</p>

<ul>
    <li>111</li>
    <li>222</li>
    <li>333</li>
</ul>
<input type="text">
<!--选择标签+标签操作（css）+事件处理

-->
<script src="jquery-3.3.1.min.js"></script>

    <script>
        //基本选择器* # .
        //$("*").css("color","red");//所有标签
        //$("#p1").css("color","red");//#取id名
        //$(".outer").css("color","red");//.取类名，父变红，子也会红所以拿到的是2个标签
        //$(".inner,p,div").css("color","red");//,隔开

        //层级选择器. > + ~
        //$(".outer p").css("color","red");
        //$(".outer>p").css("color","red");//子代选择器
        //$(".outer+p").css("color","red");
        //$(".outer~p").css("color","red");

        //基本筛选器用冒号，好几个相同才筛选
        //$("li:first").css("color","red");//只有first和last可以
         //$("li:eq(2)").css("color","red");//用eq()进行选择，，，。。。。重点
         //$("li:even").css("color","red");//奇数行有效果变红

        //属性选择器$("[]")
        //$("[alex]").css("color","red");
       // $("[alex='tom']").css("color","red");//里面是单引号

        //表单选择器
        //$("[type='text']").css("color","red");
        //$(":text").css("color","red");
       // $(":text").css("width","1000px");
    </script>
</body>
</html>

 

posted @ 2018-06-20 16:50  未来的技术  阅读(117)  评论(0)    收藏  举报