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元素;