JQuery选择器

语法风格

• jquery入口

$(function(){
//页面加载完毕后开始执行此方法
});

选择器

• $("选择器") 选中需要的元素DOM对象(有可能是多个)并封装为jquery对象

基础选择器 Basic Selectors

$("*") 选中所有的元素 别用啊~

id选择器

• $("#属性名") 选中第一个找到的属性名为"属性名"的元素

用法: $("#id属性值");   返回值是单个元素组成的集合
如：$(“#myDiv”);
说明: 这个就是直接选择html中的id="myDiv"的标签

class选择器

• $(".类名") 选中全部拥有此class属性的值为"类名"的元素

用法：$(".class属性")； 返回所有相同class属性相同的元素，是个数组
如：$(“.myclass”)
说明：返回所有class=“myclass”的标签数组

标签名选择器

• $("标签名")选中全部标签名为"标签名"的元素

用法：$(“标签名”) ； 返回所有选中的标签名相同的元素数组
如：$（“p”）
说明：返回所有的p元素组成的数组

并集选择器

• $("元素1,元素2,元素n") 选中多个元素,元素1-n可以是以上任意一种选择器

就是多个选择器同时使用、
如： $("div,p,.title" )选取所有div、p和拥有class为title的元素

属性选择器Attribute Selector

• $("元素属性名") 选中全部包含"属性名"的"元素"
• $("元素[属性名='属性值']")选中全部包含“属性名”为“属性值”的"元素"
• $("元素[属性名!='属性值']")选中全部包含“属性名”不为“属性值”的"元素"
• $("元素[属性名|='属性值']")选中全部包含“属性名”为“属性值”前缀的"元素"，前缀指的是要么单独出现，要么和后面单词有一定的分割 " "和"-"
• $("元素[属性名$='属性值']")选中全部包含“属性名”为“属性值”后缀的"元素"，后缀只要包含了'属性值'就会被选中
• $("元素[属性名^='属性值']")选中全部包含“属性名”为“属性值”前缀的"元素"，前缀只要包含了'属性值'就会被选中
• $("元素[属性名~='属性值']")选中全部包含“属性名”为“属性值”的"元素"，包含指的是 单词是独立的，不存在字符的拼接。包含man 是 n man 或 man kim ,不能是nman 、manjjj这样的 $("元素[属性名*='属性值']")选中全部包含“属性名”为“属性值”的"元素"，此包含指的是 只要字符中包含了属性值就可以了，无论是否有拼写，包含man 是 n man 或 man kim 也可以是nman 、manjjj这样的

基础过滤选择器:Basic Filter

• $("基础选择器:first") 选中需要包含的第一个元素
• $("基础选择器:last") 过滤包含的最后一个元素
• $("基础选择器:eq(下标)") 选中包含多个元素的 下标 元素
  • (选中下标所表示的元素)
  • 下标如果是正数则从前向后找
  • 如果为负数则从后向前找
  • 负数没有-0，如果要找最后一个元素是-1
• $("基础选择器:even") 选中下标为偶数的元素 从0开始
• $("基础选择器:odd") 选中下标为奇数的元素
• $("基础选择器:lt(下标)") 选中包含下标之前的全部元素
  • 如果下标为2 则会选中 0-1下标的元素
  • 如果为负数则从后向前选对选中的对象进行排除
• $("基础选择器:not(selector)") 排除selector为选择器的元素
  • selector是选择器
  • 在“基础选择器”选中的元素中排除通过"selector"选中的元素

关系选择器

• $("父级 子级") 选中"父级"全部的“子级”元素，无论中间是否有其他标签
• $("父级>子级") 选中"父级"的直接“子级”元素，只会选中第一层的关系。
• $("p+n") 选中p元素后的n元素，只选中p元素后的第一个n元素
• $("p~n") 选中p元素后的全部n元素

子过滤选择器

• $("父级 子级:first-child") 选中全部的“父级”下第一个“子级”元素
  • 如果用"父级 子级:first"只会选中第一元素,而“父级 子级:first-child”可以选中多个元素
  • 坑:如果"父级 子级"的"子级"不是第一个元素则不会被选中

$("div p:first-child")
<div><p><p><p> 这样的形式 会选中第一个p标签 	
<div><div><p><p><p> 这样的形式 不会选中第一个p标签 

• $("子级:first-of-type") 选中作为子级的第一个“子级”元素,无论是否是第一个子标签

$("p:first-of-type")
<div><p><p><p> 这样的形式 会选中第一个p标签 	
<div><div><p><p><p> 这样的形式 也会选中第一个p标签 
<jim><p><p><p>这样的形式 也会选中第一个p标签 


$("div p:first-of-type")
<div><p><p><p> 这样的形式 会选中第一个p标签 	
<div><div><p><p><p> 这样的形式 也会选中第一个p标签 
<jim><p><p><p>这样的形式不会选中第一个p标签 

• $("父级 子级:nth-child(元素的位置)") 选中“父级 子级”的第“元素的位置”的元素
  • 元素的位置不是下标，从1开始
  • 子元素指的是父元素下的子元素，不一定是“子级”代表的同样标签的子元素
• ("子级:nth-of-type(元素的位置)") 选中“子级”在父级的第几个相同元素，元素的位置不能为负值

表单元素选择器: 只能用于表单标签

• $("p:checked") 选中被选中的元素，一般用于复选按钮、单选按钮和option
• $("p:enabled") 选中被激活的元素
• $("p:disabled") 选中被屏蔽的元素