基础选择器
1. ALL Selector 选择所有的元素
1. 例 $("div *") div 下所有的元素
2. class Selector 类选择器
1. 例 $(".box") 选择class为box的元素
3. Element Selector 标签名选择器
1. 例 $("span") 选择span元素
4. ID Selector id选择器
1. 例 $("#box") 选择id为#的元素
5. Multiple Selector 合并选择器
1. 例 $("select1,select2") 选择select1,select2的元素
属性选择器
1. Attribute Contains prefix Selector [ name|="value"]
1. 选择name属性为value的元素
2. 例 $("[color|=‘red‘]") 选择color为红色的元素
2. Attribute Contains prefix Selector [ name*="value"]
1. 选择选择的name属性中包含value的元素
2. 例 $("[color*=‘red‘]") 选择color包含red的元素
3. Attribute Contains prefix Selector [ name~="value"]
1. 选择name属性用空格分隔的值包含value的元素
2. 例 $("[border~=‘1px‘]") 选择边框中有1px 的元素
4. Attribute Contains prefix Selector [name="value"]
1. 选择name属性的值为value的元素
5. Attribute Contains prefix Selector [name!="value"]
1. 选择name属性不为value的元素
6. Attribute Contains prefix Selector [name$="value"]
1. 选择name属性结尾为value的元素
7. Attribute Contains prefix Selector [name^="value"]
1. 选择name属性开始为value的元素
8. Has Attribute Selector [name]
1. 选择所有具有指定属性的元素
9. Multiple Attribute Selector [name="value1"] [name2="value2"]
1. 选择匹配所有执行属性的元素
题 : 选择具有id属性 且name属性结尾为man的元素 把他值转化为only this one
` $("[id][name$=‘man‘]").val(‘only this one‘)`
基础过滤
1. :animated Select
1. $(":animated")
2. 选择所有正在执行动画效果元素
2. :eq( index )Select
1. $(":eq(index)")
2. 选择匹配集合中索引值为index的元素
3. :even Selector
1. $(":even ")
2. 选择索引值为偶数的元素从0开始计数 也可以查看odd(奇数)
4. :first Selector
1. $(":first")
2. 选择第一个匹配的元素
5. :focus Selector
1. $(":focus")
2. 选择当前焦点的元素
6. :header Selector
1. $(":header")
2. 选择所有标题元素
7. :last Select
1. $(":last")
2. 选择最后一个匹配的元素
8. :gt() Selector
1. $(":gt(index)")
2. 选择匹配集合中所有大于给定index的元素
9. :lt() Selector
1. $("lt(index)")
2. 选择匹配集合中所有小于给定index的元素
10. :not() Selector
1. $(":not(selector)")
2. 选择所有元素去除不匹配的元素
题 : 目标被设置焦点时改变背景颜色
前情提要
delegate( )方法
childSelect:添加事件的目标
event : 规定添加的事件
data : 规定传递到函数的额外数据
function : 事件发生时发生的函数
$function( ){
$("content").delegate("*","focus bur" , function(event){
var e= $(this);
setTimeout(function(
e.toggleClass("focused", e.is(":focus"),0);
))
})
}
// 当这个元素获取焦点的时候 就添加focused的组
子元素过滤
1. :first-child
1. $(":first-child")
2. 选择父级元素的第一个子元素
2. :last-child
1. $(":last-child")
2. 选择父级元素的最后一个子元素
3. :first-of-type Selector
1. $(":first-of-type")
2. 选择所有相同元素名称的第一个兄弟元素
4. :last-of-type Selector
1. $(":last-of-type")
2. 选择所有相同元素名称的最后一个兄弟元素
5. :nth-child() Selector
1. $(":nth-child(index)")
2. 选择他们所有父元素的第n个元素
内容过滤
1. :content(text) Selector 1. jQuery(":contains(text)") 2. 选择所有包含指定文本的元素 // 区分大小写2. :empty Selector 1. jQuery(":empty") 2. 选择所有没有子元素的元素3. :has() Selector 1. jQuery(":has(selector)") 2. 选择其中一个包含指定选择器的元素 3. 题 :选择所有div中含有p元素的元素 4. $("div:has(p)")4. :parent Selector 1. jQuery(":parent") 2. 选择所有包含子元素的父级元素 // empty相反