<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>test</title>
<style type="text/css">
.red{background: #f00;}
</style>
<script type="text/javascript" src="http://lib.sinaapp.com/js/jquery/1.9.1/jquery-1.9.1.js"></script>
</head>
<body>
<div class="a red">111</div>
<div class="a">222</div>
<div class="a">333</div>
<div class="a">444</div>
<script>
$('.a').each(function(){
if($(this).hasClass('red')){
alert($(this).html());
}
})
</script>
</body>
</html>
var _this = $(this);
//index是匹配到的元素的顺序,从0开始。
if(index == 0){
_this.css({"background":"#000"});
}else{
_this.css({"background":"#f00"});
}
});感觉,这也没有什么说效率最好的方法啊比如你如果要查找第一个符合一定条件的元素的话,也可以使用下面的方法:
$(".a").each(function(){
$(this).addClass("red");
//这里必须要返回一个false,那么就只会对第一个元素进行操作
//不会对最后的元素再操作了。
//这里,在判断一个条件,当条件第一次成立时,执行一个操作,并返回false
//那么其他的就不会再执行了。
return false;
})还有一个就是,如果对一组元素进行操作的话,最好是缓存一下,比如你代码中,两行代码使用了$(".a")的选择,这个时候,最好还是定义一个变量,暂时保存一下,比如这样:
var a = $(".a");
a.css({"background":"#f00"});
a.eq(0).css({"background":"#000"});//为什么这么写,因为你每用一次$选择器,获取到的集合,都需要重新获取的
//这样就会花费时间去重新再页面获取符合要求的元素。console.log($(".a") == $(".a")); //false
//虽然,上面这两个的结果是相同的,但他们却不相等
//所以,是重新选择的,所以缓存一下最好
//现在选择器还不算复杂,如果复杂了,就会比较占用时间了。仅供参考。
弱弱的请问是否有不加red类的方法呢?
弱弱的请问是否有不加red类的方法呢?有,但太麻烦了,不推荐。
看你的代码是设置
设置的话:$(".a:first").css({"background":"#f00"});
//或
$(".a:eq(0)").css({"background":"#f00"});$(".a:gt(0)").css({"background":"#000"});
alert(c);
//if ...
$(".a").each(function(){
var a=$(this).index();
if(a==0){
$(this).css("background","#f00");
}else{
$(this).css("background","#000");
}
})