对于标签的名进行选择的话直接输入就好
对于id需要加入#
对于class需要加入.
对于想对于某个元素包含的子元素都实行所有的属性加入 *
<!DOCTYPE html> <html> <head> <title>*选择器</title> <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js" type="text/javascript"></script> </head> <body> <form action="#"> <input id="Button1" type="button" value="button" /> <input id="Text1" type="text" /> <input id="Radio1" type="radio" /> <input id="Checkbox1" type="checkbox" /> </form> <script type="text/javascript"> $("form *").attr("disabled", "true"); </script> </body> </html>
对于多个标签同时
$(".red,.green,.blue").html("hi,我们的样子很美哦!");
对于某个div下的某个子元素例如p则是$("div p")包括孙子
$("div label").css("border", "solid 5px red");
对于某个div下的某个子元素例如p则是$("div p")不包括孙子
$("div>label").css("border", "solid 5px red");
对于某个标签的下一个标签
$("p+label").css("background-color","red");
prev ~ siblings
选择器也是查找prev 元素之后的相邻元素,但前者只获取第一个相邻的元素,而后者则获取prev 元素后面全部相邻的元素,它的调用格式如下
$("p~label").css("border", "solid 1px red"); $("p~label").html("我们都是p先生的粉丝");
某个标签的第几个
$("li:last").css("background-color", "red"); $("li:first").css("background-color", "red");
如果想从一组标签元素数组中,灵活选择任意的一个标签元素,我们可以使用
:eq(index)
其中参数index表示索引号(即:一个整数),它从0开始,如果index的值为3,表示选择的是第4个元素
$("li:eq(2)").css("background-color", "#60F");
我们可能希望按照文本内容来查找一个或多个元素,那么使用:contains(text)
选择器会更加方便, 它的功能是选择包含指定字符串的全部元素,它通常与其他元素结合使用,获取包含“text”字符串内容的全部元素对象。其中参数text
表示页面中的文字。
$("li:contains('jQuery')").css("background", "green");
使用包含的元素名称来过滤,:has(selector)
过滤选择器的功能是获取选择器中包含指定元素名称的全部元素,其中selector
参数就是包含的元素名称,是被包含元素。
$("li:has('label')").css("background-color", "blue");