jquery 一

?

转载至：http://www.jileiba.com/2012/06/02/jquery%e9%80%89%e6%8b%a9%e5%99%a8%e5%a4%a7%e5%85%a848%e4%b8%aa%e4%bb%a3%e7%a0%81%e7%89%87%e6%ae%b521%e5%b9%85%e5%9b%be%e6%bc%94%e7%a4%ba/

?

一、基本选择器

1. id选择器（指定id元素）

将id="one"的元素背景色设置为黑色。（id选择器返单个元素）

——1.4?:eq(x)?（取指定索引的元素）
上面第三个dd会显示"没有内容"文本
——2.3?:has(selector)（取选择器匹配的元素）
参照：http://www.jquerysdk.com/api/hidden-selector
下面的代码，先弹出"hello"对话框，然后hid-1会显示，hid-2仍然是不可见的。
——3.2?:visible（取可见的元素）
下面的代码，最后一个div会有背景色
4. 属性过滤选择器
——4.1?[attribute]（取拥有attribute属性的元素）
下面的代码，最后一个a标签没有title属性，所以它仍然会带下划线
——4.2?[attribute = value]和[attribute != value]（取attribute属性值等于value或不等于value的元素）
分别为width="313" title="image" height="206" style="background-image: none; padding-left: 0px; padding-right: 0px; display: inline; padding-top: 0px;" alt="jquery 1">
也许你觉得这个答案，是不是太简单了？len1 = 2, len2 = 2。但实际确并不是，它们俩都等于3。?
把上面的代码稍微修改一下：
结果却是弹出三个alert，只不过最后一个alert里面是空白的。
——5.2?:only-child
当某个元素有且仅有一个子元素时，:only-child才会生效。
这里:only-child也是三个元素，从最后一个很粗的红色边框（实际是两个元素的边框重叠了）也可以看出来。
——5.3?:nth-child
看到这个就想起英文单词里的，fourth, fifth, sixth……，nth表示第n个，:nth-child就表示第n个child元素。要注意的是，这儿的n不像eq(x)、gt(x)或lt(x)是从0开始的，它是从1开始的，英文里好像也没有zeroth这样的序号词吧。
:nth-child有三种用法：
1) :nth-child(x)，获取第x个子元素?
2) :nth-child(even)和:nth-child(odd)，从1开始，获取第偶数个元素或第奇数个元素?
3) :nth-child(xn+y)，x>=0，y>=0。例如x = 3, y = 0时就是3n，表示取第3n个元素（n>=0）。实际上xn+y是上面两种的通项式。（当x=0,y>=0时，等同于:hth-child(x)；当x=2,y=0时，等同于nth-child(even)；当x=2,y=1时，等同于:nth-child(odd)）
下面的两个例子是针对2)和3)的，1)的例子我就不列举了。
例2：
例3（html代码和例2是一样的）：
——6.2?:checked（取选中的单选框或复选框元素）
下面的代码，更改边框或背景色仅在IE下有效果，chrome和firefox不会改变，但是alert都会弹出来。
——6.3?:selected（取下拉列表被选中的元素）
4.?:checkbox（取复选框元素）
:checkbox选择器和属性选择器$('input[type=checkbox]')等同
上面的代码，会将所有额checkbox的value输出出来。若你想选择选中项，有三种写法：
$(':checkbox:checked').each(function() {    alert($(this).val());});$('input[type=checkbox][checked]').each(function() {    alert($(this).val());});$(':checked').each(function() {    alert($(this).val());});
5.?:submit（取提交按钮元素）
:submit选择器和属性选择器$('input[type=submit]')等同
6.?:reset（取重置按钮元素）
:reset选择器和属性选择器$('input[type=reset]')等同
7.?:button（取按钮元素）
:button选择器和属性选择器$('input[type=button]')等同
8.?:file（取上传域元素）
:file选择器和属性选择器$('input[type=file]')等同
9.?:hidden（取不可见元素）
:hidden选择器和属性选择器$('input[type=hidden]')等同
表单选择器的6~10例子我就不再列举了，和1~5的很类似，大家可以自己尝试一下。