JQuery选择器【JQ笔记一】 - by kiwi

1.js
var pp = document.getElementsByTagName('p');

2.jq基本选择器
$(".class_name");
$("#id_name");
$("p");
$("span, p, input.user_name");  //多选

3.层次选择器
$("div p");     // div中全部的p
$("div > p");   // 选div下span的子元素  ？？不是很懂，跟上面的效果同样
$('#one + p');  //选取clss为one的p元素下一个p标签，两者貌似必须都为相同标签，测试了的  等价与  $('#one').next('p');
$("#two~div");   //选取id为two的元素后面的全部div同辈元素 $('#two').next('div');

4.基本过滤选择器
$('div:first');    //选择第一个div
$('div:last');     // 选择最后一个div
$('input:not(.className)');  //选取class不是className的input
$('input:even');   //选择索引为偶数的input
$('input:odd');   //选择索引为奇数的input
$('input:eq(1)'); //选取索引为1的input  
$('input:gt(1)');  //选择索引大于1的input，不包括1
$('input:lt(1)');  
$(':header');        //选取全部的标题元素，h1 h2 h3 ...
$('div:animated');  //选择正在执行的动画div
$(':focus');       //选择当前获取焦点的元素

5. 内容过滤选择器
$("div:contains('测试')");            //选取含有文本“测试”的div元素
$("div:empty");                 //选择不包含子元素的div元素
$("div:has(p)");       //选择含有p元素的div元素
$("div:parent");       //选择拥有子元素的div元素

6. 可见性过滤选择器
$(":hidden");   //选择全部不可见的元素
$("div:visible");  //可见的div，及只要不是hidden就ok

7. 属性过滤选择器
$('div[id]');             //   选择拥有属性id的div
$('div[title=test]');      //   选择属性title等于test的div元素
$("div[title!=test]");     //  不等于
$("div[title^=test]");     //  选择属性title以test开头的div元素
$("div[title$=test]");     //  选择属性title以test结束的div元素
$("div[title*=test]");     //选择属性title含有test的div元素
$('div[title|=en]');     //选择属性title等于en或者以en为前缀（en-test）的元素
$('div[title~="uk"]');     //
$("div[id][title$='test']");  // 拥有属性id，而且title一test结束

8. 表单对象属性过滤选择器
$("#formName :enabled");       //选择id为fromName的表单内全部可用的元素
$("#formName :disabled");      //选择id为fromName的表单内全部bu可用的元素
$("input:checked");            //选择全部勾选上的checkbox
$("select option:selected");   //选择全部选中的option

9.表单选择器
$(":input");   //全部input 包括input textarea  selext button
$(":password");   
$(":radio");  
$(":checkbox");  
$(":submit");  
$(":image"); 
$(":reset");  
$(":button");   
$(":file");  
$(":hidden");