JQuery选择器

//基础选择器

//id选择器

$("#my_id").html("哈哈哈");//把id为my_id的元素的html属性设置为哈哈哈

//元素选择器

$("button").attr("disabled","true");//把所有的button按钮设置为不可用

//类选择器

var classname = $(".red").attr("class"); //获取类名为red的元素的class属性的名称 classname的值为red

//*选择器

$("#myid *").html("哈哈哈");//把id为myid的元素下的所有子元素的html属性设置为哈哈哈

//多元素选择器

$(" div,p,#myid,.red").html("哈哈哈"); //把 div p id为myid的元素 类名为.red的元素的html属性都设置为哈哈哈

//层次选择器

$(" #myid p").css("background-color","red"); //把id为myid的元素下的所有的p元素的背景颜色设置为红色

//parent>child选择器

$("#myid > p").css("background-color","red");//把id为myid的元素下的第一级子元素中的p元素的背景颜色设置为红色

//prev+next选择器

$("label + p").css("background-color","red");//把第一个label的同一级次的后面的第一个p元素的背景颜色设置为红色

//prev~siblings选择器

$("label ~ p").css("background-color","red");//把第一个label的同一级次的后面的所有的p元素的背景颜色设置为红色

 

 

//过滤性选择器

//:first过滤选择器

$("li:first").css("color","red");//找到li标签的第一个元素,把元素的颜色设置为red

//:last过滤选择器

$("li:last").css("color","red");//找到li标签的最后一个元素,把元素的颜色设置为red

//:eq过滤选择器 下标从0开始的

$("li:eq(2)").css("color","red");//找到li标签的第三个元素,把元素的颜色设置为red

//:contains过滤选择器

$("li:contains('哈哈哈')").css("color","red");//找到所有li标签的文本中包含哈哈哈的元素对象

//:has过滤选择器

$("li:has('p')").css("color","red");//找到所有li标签中包含p标签的元素,把p标签的文本的颜色设置为red

//:hidden过滤选择器

var strval=$("input:hidden").val();//找到是隐藏属性的input标签的val()值 //获取不可见的元素

//:visible过滤选择器

var strhtml=$("p:visible").html();//找到所有是可见属性的p元素的html文本 //获取可见的元素

//:first-child子元素过滤选择器

 $("li:first-child").css("background-color", "red");//如果有两个ul元素 里面有两个li组  那么每个组的第一个li元素的背景色会被设置为red

//:last-child子元素过滤选择器

$("li:last-child").css("background-color", "red");//如果有两个ul元素 里面有两个li组  那么每个组的最后一个li元素的背景色会被设置为red

 

 

//属性选择器

//[Attribute=value]属性选择器

$("li[title='哈哈哈']").css("color","red");//获得title属性的值是哈哈哈的li标签元素,并把样式设置为红色

//[Attribute!=value]属性选择器

$("li[title!='哈哈哈']").css("color","red");//获得title属性的值不是哈哈哈的li标签元素,并把样式设置为红色

//[Attribute*=value]属性选择器

$("li[title*='哈']").css("color","red");//获得title属性的值包含哈的li标签元素,并把样式设置为红色  类似于Sql中的like

 

 

//表单选择器

//:input表单选择器

$("#formid :input").addClass("bg_red"); //获取form下的所有表单元素 包括textarea select

//:text表单选择器

$("#formid :text").addClass("bg_red"); //获取form下的所有text标签元素 不包括textarea 

//:password表单选择器

$("#formid :password").addClass("bg_red"); //获取form下的所有password标签元素 

//:radio表单选择器

$("#formid :radio").hide(); //获取form下的所有radio标签元素  并隐藏

//:checkbox表单选择器

$("#formid :checkbox").attr("checked","true"); //获取form下的所有checkbox标签元素  并设置为选中

//:submit表单选择器

$("#formid input:submit").attr("value","哈哈哈"); //获取form下的所有submit标签元素(一般默认只能有一个submit按钮)  并把value属性设置为哈哈哈

//:image表单选择器

$("#formid :image").addClass("bg_red");; //获取form下的所有image标签元素  将背景色设置为red

//:button表单选择器

$("#formid :button").addClass("bg_red");; //获取form下的所有button标签元素  将背景色设置为red

//:checked表单选择器

$("#formid :checked").attr("disabled",true);; //获取form下的所有处于选中状态的标签元素(checkbox,radio)  设置为不可用

//:selected表单选择器

$("#formid :selected").text("哈哈哈");//获取form下的select元素的正处于选中状态的option标签元素,把文本值设置为哈哈哈

 

posted @ 2015-01-24 18:22  YyuTtian  阅读(237)  评论(0编辑  收藏  举报