好资源导航 » 文章资讯 » jQuery选择器之属性过滤选择器详解

jQuery选择器之属性过滤选择器详解

2023-09-23 22:01:07 50

本文实例为大家分享了jQuery属性过滤选择器的具体代码，供大家参考，具体内容如下




UntitledDocument


div,span,p{
width:140px;
height:140px;
margin:5px;
background:#aaa;
border:#0001pxsolid;
float:left;
font-size:17px;
font-family:Verdana;
}

div.mini{
width:55px;
height:55px;
background-color:#aaa;
font-size:12px;
}

div.hide{
display:none;
}



$(function(){

$("#btn1").click(function(){
$("div[title]").css("background","#ffbbaa");
});
$("#btn2").click(function(){
$("div[title='test']").css("background","#ffbbaa");
});
$("#btn3").click(function(){
//选取的元素中包含没有title的div元素.
$("div[title!='test']").css("background","#ffbbaa");
});

$("#btn4").click(function(){
$("div[title^='te']").css("background","#ffbbaa");
});

$("#btn5").click(function(){
$("div[title$='est']").css("background","#ffbbaa");
});
$("#btn6").click(function(){
$("div[title*='es']").css("background","#ffbbaa");
});
$("#btn7").click(function(){
$("div[id][title*='es']").css("background","#ffbbaa");
});

$("#btn8").click(function(){
$("div[title][title!='test']").css("background","#ffbbaa");
});

})

















id为one,class为one的div
class为mini

id为two,class为one,title为test的div class为mini,title为other

class为mini,title为test

class为mini class为mini class为mini class为mini class为mini class为mini class为mini,title为tesst style的display为"none"的div class为"hide"的div

包含input的type为"hidden"的div

正在执行动画的div元素.

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持毛票票。

返回顶部
514930285
czq8825@qq.com

jQuery选择器之属性过滤选择器详解

热门推荐

随机推荐