<!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>:first/:last/:even/:odd</h3>? ? <div class="left">? ? ? ? <div class="div">? ? ? ? ? ? <p>div:first</p>? ? ? ? ? ? <p>:even</p>? ? ? ? </div>? ? ? ? <div class="div">? ? ? ? ? ? <p>:odd</p>? ? ? ? </div>? ? ? ? <div class="div">? ? ? ? ? ? <p>:even</p>? ? ? ? </div>? ? ? ? <div class="div">? ? ? ? ? ? <p>:odd</p>? ? ? ? </div>? ? ? ? <div class="div">? ? ? ? ? ? <p>:even</p>? ? ? ? </div>? ? ? ? <div class="div">? ? ? ? ? ? <p>div:last</p>? ? ? ? ? ? <p>:odd</p>? ? ? ? </div>? ? </div>? ? <script type="text/javascript">? ? //找到第一個div? ?$(".div:first").css("color", "#CD00CD");? ? </script>? ??? ? <script type="text/javascript">? ? //找到最后一個div? ? $(".div:last").css("color", "#CD00CD");? ? </script>? ??? ? <script type="text/javascript">? ? //:even 選擇所引值為偶數(shù)的元素，從 0 開始計數(shù)? ? $(".div:even").css("border", "3px groove red");? ? </script>? ??? ? <script type="text/javascript">? ? //:odd 選擇所引值為奇數(shù)的元素，從 0 開始計數(shù)? ? $(".div:odd").css("border", "3px groove blue");? ? </script>? ??? ??? ? <h3>:eq/:gt/:lt</h3>? ? <div class="left">? ? ? ? <div class="aaron">? ? ? ? ? ? <p>:lt(3)</p>? ? ? ? </div>? ? ? ? <div class="aaron">? ? ? ? ? ? <p>:lt(3)</p>? ? ? ? </div>? ? ? ? <div class="aaron">? ? ? ? ? ? <p>:eq(2)</p>? ? ? ? </div>? ? ? ? <div class="aaron">? ? ? ? </div>? ? ? ? <div class="aaron">? ? ? ? ? ? <p>:gt(3)</p>? ? ? ? </div>? ? ? ? <div class="aaron">? ? ? ? ? ? <p>:gt(3)</p>? ? ? ? </div>? ? </div>? ? <script type="text/javascript">? ? //:eq? ? //選著單個? ? $(".aaron:eq(2)").css("border", "3px groove blue");? ? </script>? ??? ? <script type="text/javascript">? ? //:gt 選擇匹配集合中所有索引值大于給定index參數(shù)的元素? ? $(".aaron:gt(3)").css("border", "3px groove blue");? ? </script>? ??? ? ?<script type="text/javascript">? ? //:lt 選擇匹配集合中所有索引值小于給定index參數(shù)的元素? ? //與:gt相反? ? $(".aaron:lt(2)").css("color", "#CD00CD");? ? </script>? ??? ? <h3>:not</h3>? ? <div class="left">? ? ? ? <div>? ? ? ? ? ? <input type="checkbox" name="a" />? ? ? ? ? ? <p>Aaron</p>? ? ? ? </div>? ? ? ? <div>? ? ? ? ? ? <input type="checkbox" name="b" />? ? ? ? ? ? <p>慕課</p>? ? ? ? </div>? ? ? ? <div>? ? ? ? ? ? <input type="checkbox" name="c" checked="checked" />? ? ? ? ? ? <p>其他</p>? ? ? ? </div>? ? </div>? ? <script type="text/javascript">? ? ? ? //:not 選擇所有元素去除不匹配給定的選擇器的元素? ? ? ? //選取所有input中,沒有checked屬性的p元素，賦予顏色? ? ? ? $("input:not(:[name='c'])+p").css("background-color", "#CD00CD");? ? </script></body></html>謝謝大神
3 回答
已采納
Accompany
TA貢獻13條經(jīng)驗 獲得超2個贊
?$("input:not(input[name=c])+p").css("background-color", "#CD00CD");
$("input:not(input:checked)+p").css("background-color", "#CD00CD");這樣也行 ?選其一
stone310
TA貢獻361條經(jīng)驗 獲得超191個贊
$("input").not(document.getElementsByName('c')).css("background-color", '#CD00CD');
checkbox加背景沒效果的，所以這么寫，將name不等于c的框設為選中
$("input").not(document.getElementsByName('c')).attr('checked',true);
- 3 回答
- 1 關注
- 1799 瀏覽
添加回答
舉報
0/150
提交
取消