首页 > 代码库 > jQuery-筛选器

jQuery-筛选器

2024-09-04 09:12:14   219人阅读

<script>
$(document).ready(function(){
$("#but10").click(function(){
    $("p:first").toggle();        //("x:first")
  });    //第一个x 筛选器
  
  $("#but11").click(function(){
    $("p:not(#xxx)").toggle();        //("x:not(s)")     s:x的属性
  });    //不是x的s的 筛选器
  
  $("#but12").click(function(){
    $("p:even").toggle();        //("x:even")   查找1,3,5行  0,2,4计数
  });    //奇数行 筛选器
  
  $("#but13").click(function(){
    $("p:odd").toggle();        //("x:odd")   查找2,4,6行  1,3,5计数  
  });    //偶数行 筛选器
  
  $("#but14").click(function(){
    $("p:eq(2)").toggle();        //("x:eq(n)")  n:数字  0开始计数
  });    //查找x的第n行 筛选器
  
  $("#but15").click(function(){
    $("p:gt(2)").toggle();        //("x:gt(n)")
  });    //查找x的比n大的行数 筛选器
  
  $("#but16").click(function(){
    $("p:lang(xxx)").toggle();        //("x:lang(s)")   
  });    //x的lang=s和他的后代 筛选器
  
  $("#but17").click(function(){
    $("p:last").toggle();        //("x:last")
  });    //最后一个x 筛选择器
  
  $("#but18").click(function(){
    $("p:lt(2)").toggle();        //("x:lt(n)")
  });    //查找x的比n小的行数 筛选器
  
  //筛选器
  
  
  
  $("#but19").click(function(){
    $(":header").css("background", "red");        
  });    //给hx标题加上背景颜色
  
  
  
  $("#but20").click(function(){
  $("div").animate({ left: "+=20" });
});
  
  
  
  $("#but21").click(function(){
        //
  });    //
  
  
  
  $("#but22").click(function(){
    $(":root").css("background-color","yellow");        
  });    //给html加上背景颜色
  
  $("#but23").click(function(){
    $("p:first").toggle();        //("x:first")
  });    //
  
  //
  
  
  
});
</script>
<body>
<input id="but10" type="button" value="http://www.mamicode.com/第一个">
<input id="but11" type="button" value="http://www.mamicode.com/未选中">
<input id="but12" type="button" value="http://www.mamicode.com/奇数">
<input id="but13" type="button" value="http://www.mamicode.com/偶数">
<input id="but14" type="button" value="http://www.mamicode.com/n行">
<input id="but15" type="button" value="http://www.mamicode.com/比n大行">
<input id="but16" type="button" value="http://www.mamicode.com/属性">
<input id="but17" type="button" value="http://www.mamicode.com/最后一个">
<input id="but18" type="button" value="http://www.mamicode.com/比n小">
<input id="but19" type="button" value="http://www.mamicode.com/标题背景">
<input id="but20" type="button" value="http://www.mamicode.com/动画">
<input id="but21" type="button" value="http://www.mamicode.com/不会">
<input id="but22" type="button" value="http://www.mamicode.com/背景颜色">
<input id="but23" type="button" value="http://www.mamicode.com/不懂">
</body>

 

jQuery-筛选器


联系
我们