jquery--选择器

jquery复习--选择器

 

一,基本选择器

1,id 选择器 var $div = $("#idName"); 和DOM的document.getElementById("id");
2,class类选择器 var $div= $(".className") ;和 DOM的document.getElementsByClassName("className");
3,element选择器 var $element= $("elementName");和DOM的document.getElementsByTagName('elementName');

二,层选择器

1,var  $p=$("div>p");div中第一代子元素p;
2,var  $p=$("div p");div中所有的子元素p;
3,var  $p=$(“.class+div”);类class后的兄弟元素;
4,var  $p=$(“.class~div”);类class后的所有兄弟元素;

三,刷选选择器

1,var $div=$(“.class:first”);找到第一个元素;var $div=$(“.class:last”);找到最后一个元素;
2,var $p=$(“.class>p:eq(2)”);在匹配的元素集合中选择第二个p元素;
3,var $div=$(“.class>p:gt(3)”)在匹配的元素集合中选择大于3的p元素
4,var $div=$(“.class>p:even”);选择匹配的元素集合中选择为偶数的p元素;
5,var $div =$(“.class>p:odd”);选择匹配的元素集合中选择为奇数的p元素;
6,var $div=$(“.class>p:lt(2)”);选择匹配的元素集合中选择小于2的p元素;
7,var $header=$(“:header”);选择所有的标题元素;
8,var $animated=$(:animated);选择所有正在执行动画效果的元素;
9,var $root=$(“:root”);选择该文档的根元素;
10,var $visible=$(“:visible”);选择所有的可见元素;
11,var $hidden=$(“:hidden”);选择所有的隐藏元素;

四,属性选择器

1,var $div=$(“div[name=’p1’]”);在所有的div元素中选择属性name为p1的元素;
2,var $div=$(“[name]”);选择所有的div有name属性的元素;
3,var $div=$([“div[name~=’a’]”);查找所有div中，有属性name中的值包含一个连字符“空”和“a”的div元素;
4,var $div=$(“div[name!=’p1’]”);查找所有div中，有属性name中的值没有包含"p1"的div;
5,var $div=$(“div[name*=’p1’]”);查找所有div中，有属性name中的值包含一个p1字符串的div元素
6,var $div=$(“div[name^=’p1’]”);查找所有div中，属性name的值是用p1开头的
7,var $div=$(“div[name$=’p1’]”);查找所有div中，属性name的值是用p1结尾的

五,子元素刷选器

1,var $div=$(“.class>p:first-child”);选择所有父级元素下的第一个子元素;
2,var $div=$(“.class>p:last-child”);选择所有父级元素下的最后一个子元素;
3,var $div=$(“.class>p:only-child”);如果父级元素只有一个子元素，那么子元素会被选中;
4,var $div=$(“.class>p:nth-child(2)”);选择父元素的第2个子元素

六,表单选择器

1,var  $input=$(“:input”);选择所有的textarea input button select元素;
2,var  $input=$(“input:text”);匹配所有的文本框;
3,var  $input=$(“input:password”);匹配所有的密码框;
4,var  $input=$(“input:radio”);匹配所有的单选框;
5,var  $input=$(“input:checkbox”);匹配所有的复选框;
6,var  $input=$(“input:submit”);匹配所有的提交按钮;
7,var  $input=$(“input:reset”);匹配所有的重置按钮;
8,var  $input=$(“input:image”);匹配所有的图像域;
9,var  $input=$(“input:button”);匹配所有的按钮;
10,var  $input=$(“input:file”);匹配多有的文件域;

七,表单属性选择器

1,var  $input=$(“input:enabled”);匹配所有的可用的表单元素;
2,var  $input=$(“input:disabled”);匹配所有的不可用的表单元素;
3,var  $input=$(“input:checked”);匹配所有的被选择的input元素;
4,var  $input=$(“input:selected”);匹配所有的被选中的option元素;