1、基础选择器(5个)
#id 选择器 $("divId") 选择ID为divId的元素
.class 类选择器 $("class") 选择所有CSS类为class的元素
tag 标签选择器 $("a") 选择所有
* 通配选择器 $("*") 选择页面所有元素
, 分组选择器 $("#divId,a,class")
2、层次选择器
3、基本过滤器
:first选取第一1个元素。$("div:first")
:last选取最后一个元素。$("div:last")
:not选取不满足“选择其”条件的元素。$("input:not(.myClass)")
:even,:odd选取索引是偶数、奇数的元素 $("tr:even") $("tr:odd")
:eq(索引序号),:gt(索引序号),:lt(索引序号)分别表示
等于、大于、小于等于索引的元素。
:header选取所有h1...h6元素。$(":header")
4、内容过滤器
:contains(text) $("div:contains('text')")
:parent 查找所有子元素或者文本的td元素 $("td:parent")
:empty 查找所有不包含子元素或者文本的空元素 $("td:empty")
5、可见性过滤器
:hidden 匹配所有的不可见元素 $("tr:hidden")
:visible 匹配所有的可见元素 $("tr:visible")
visivity:hidden 不可见元素
6、属性过滤器
[ attribute] 匹配包含给定属性元素
[attribute=value] 匹配给定的属性是某个特定值的元素
$("input[name='text']").attr("checked",true)
[attribute!=value] 匹配给定的属性是某个特定值的元素
[attribute^=value] 匹配给定的属性是以某些值开始的元素
[attribute$=value] 匹配给定的属性是以某些值结束的元素
[attribute*=value] 匹配给定的属性是包含某些值的元素
[attrbuteFilter1] 符合属性选择器,需要满足多个条件时使用,$("input[id][name='text']")
[attrbuteFilter2]
[attrbuteFilter3]
$(function () {
//属性过滤器
alert($("a[title][title=#]").text()); //过滤title等于#的
alert($("a[title][title!=#]").text());//过滤title不等于#的
alert($("a[href][href=#]").attr("href", "javascript:void(0)")); //替换一个属性
$("a[href][href=#]").attr({ href: "javascript:void(0)",title:"修改后的超链接"}) //替换多个属性
});
attr("","") 替换属性
attr({_:“”,_:""}) 替换多个属性 中间用逗号隔开
$(function () {
$("a[href][href=#]").click(function () {
alert($(this).text()); //单击事件 显示点击内容
});
7、子元素过滤器
alert($("ul li:first").text());
alert($("ul li:nth-child(odd)").text());//奇数
alert($("ul li:nth-child(even)").text()); //偶数
alert($("ul li:nth-child(2n)").text()); //2的倍数