<ul> <li>11111</li> <li class="item">22222</li> <li>33333</li> <li>44444</li> <li>55555</li> <li>66666</li> <li>77777</li> </ul>
$("ul>li").filter(":even").css("color","red");
//将索引为偶数的li背景变为红色
$("ul>li:even").css("color","red");
//将索引为偶数的li背景变为红色
$("ul>li").filter(":even,.item").css("color","blue");
//将索引为偶数和calss为item的li背景变为蓝色
<ul>
<li>11111</li>
<li class="item">22222</li>
<li>33333</li>
<li>44444</li>
<li>55555</li>
<li>66666</li>
<li>77777</li>
</ul>
<input type="button" id="test1" value="获取索引为偶数的li">
<input type="button" id="test2" value="获取索引为偶数和calss为item的li">
<script>
$(function(){
$("#test1").click(function(){
$("ul>li").filter(":even").css("color","red");//将索引为偶数的li背景变为红色
//这个式子和 $("ul>li:even").css("color","red"); 等效
});
$("#test2").click(function(){
$("ul>li").filter(":even,.item").css("color","blue");//将索引为偶数和calss为item的li背景变为蓝色
});
});
</script>
<div id="first"></div> <div id="second"></div> <div id="third"></div> <div id="fourth"></div> <div id="fifth"></div> <div id="sixth"></div>
$("div").filter(function(index) {
return index == 1 || $(this).attr("id") == "fourth";
}).css("border", "5px double blue");
<style>
div{ width:60px; height:60px; margin:5px; float:left;border:3px white solid;background:#ff0000 }
</style>
<div id="first"></div>
<div id="second"></div>
<div id="third"></div>
<div id="fourth"></div>
<div id="fifth"></div>
<div id="sixth"></div>
<br><br><br><br><br><br>
<input type="button" id="test" value="点击我看看上面的div的变化">
<script>
$("#test").click(function(){
$("div").filter(function(index) {
return index == 1 || $(this).attr("id") == "fourth";
}).css("border", "5px double blue");
});
</script>
机械节能产品生产企业官网模板...
大气智能家居家具装修装饰类企业通用网站模板...
礼品公司网站模板
宽屏简约大气婚纱摄影影楼模板...
蓝白WAP手机综合医院类整站源码(独立后台)...苏ICP备2024110244号-2 苏公网安备32050702011978号 增值电信业务经营许可证编号:苏B2-20251499 | Copyright 2018 - 2025 源码网商城 (www.ymwmall.com) 版权所有