一：基础选择器：
//根据指定的id匹配对应的元素
$('#btn1').click(function () {
alert('我是通过选择器选择到的');
});
//如果控件id值中含有特殊符号，在选择器中可以使用\\来解析
$('#btn\\1').click(function () {
alert('选择含有特殊字符的id选择器');
});
//根据标签名称匹配指定的标签
$('input').click(function () {
alert('我是标签选择器');
});
//根据指定的类名来匹配元素
$('.cls1').css('border', '1px solid blue'); //类选择器类名在控件中的时候不带点在选择器中的时候带点.
//匹配所有的元素
$('*').css('border', '1px solid blue');//匹配页面上所有的元素
//将多个选择器的结果组合起来返回
$('div.cls1,span,#btn,input').css('border', '1px solid blue');//组合选择器将多个选择器的到的结果合并到一个结果中
二：层级选择器：
//在匹配给定的根元素下所有元素
$('form input').css('border', '1px solid blue');
//匹配指定根元素下的所有子元素
$('form > input').css('border', '1px solid blue');
//匹配紧跟在lable后边的input标签
$('lable + input').css('border', '1px solid blue');
//匹配所有lable后边的所有标签元素
$('lable ~ input').css('border', '1px solid blue');
三：基本选择器：
//获取指定标签下第一个元素
$('li:first').css('border', '1px solid blue');
$('li').first().css('border', '1px solid blue');
//获取指定标签下的最后一个元素
$('li:last').css('border', '1px solid blue');
$('li').last().css('border', '1px solid blue');
//去除所有指定选择器所匹配的元素
$('input:not(:checked)').css('border', '1px solid blue');
$('input:not(#btn1)').css('border', '1px solid blue');
//匹配所有索引值为偶数的元素
//1,3,5列对应的索引值为0,2,4
$('li:even').css('border', '1px solid blue');
//匹配所有索引值为奇数的元素
$('li:odd').css('border', '1px solid blue');
//匹配一个指定索引值的元素（索引为1，表示第二个人元素） $('li:eq(1)').css('border', '1px solid blue');
//匹配所有大于给定索引值的元素
//索引值为2，表示第三行以后的所有元素
$('li:gt(2)').css('border', '1px solid blue');
//匹配所有小于给定索引值的元素
//索引值为2，表示第三行以前的元素
$('li:lt(2)').css('border', '1px solid blue');
//匹配h1到h6之间的所有标题元素
$(':header').css('border', '1px solid blue');
//匹配所有正在执行动画效果的元素
$('#run').click(function () {
$('div:not(:animated)'.animate({left:"+=20"},1000);)
});
四：内容选择器：
//匹配所有包含指定文本的元素
$("div:contains('yyj')").css('border', '1px solid blue');
//匹配所有不包含子元素，不包含文本的空元素
$('div:empty').css('border', '1px solid blue');
//选择含有选择器选定的元素的元素
$("div.has('yh')").css('border', '1px solid blue');
//匹配含有子元素或者含有文本的元素
$('div:parent').css('border', '1px solid blue');
五：可见性选择器：
//选择所有空间type属性为hidden的元素
$('tr:hidden').css('border', '1px solid blue');
//匹配所有可见元素
$('tr:visible').css('border', '1px solid blue');
//匹配含所有指定属性的元素
$('div[id]').css('border', '1px solid blue');
/匹配某一属性是某一特定值的元素
$('input[name="myname"]').attr('checked',true);
//匹配所有不包含指定属性或者属性不等于指定值得元素
$('input[name!="myname"]').attr('checked',true);
//匹配给定的属性是以某些字符开始的元素
$('input[name^="my"]').attr('checked',true);
//匹配给定的属性是以某些字符结束的元素
$('input[name$="name"]').attr('checked',true);
//匹配指定的属性值包含某字符串的元素
$('input[name*="my"]').attr('checked',true);
//复合选择器，需要同时满足多个条件的元素
$('input[id][name$="name"]').attr('checked',true);
6：子元素选择器：
//在每一个ul中查看第二个li
$('ul li:nth-child(2)').css('border', '1px solid blue');
//在每一个ul中查看第一个li
$('ul li:first-child').css('border', '1px solid blue');
//在每一个ul中查看最后一个li
$('ul li:last-child').css('border', '1px solid blue');
//在ul中查找含有唯一li的元素
$('ul li:only-child').css('border', '1px solid blue');
7：表单选择器：
//查看所有含有input标签的元素
$(':input').css('border', '1px solid blue');
//查看所有单行文本框
$(':text').css('border', '1px solid blue');
//查看所有密码框
$(':password').css('border', '1px solid blue');
//查看所有的单选按钮
$(':radio').css('border', '1px solid blue');
//查看所有的复选框
$(':checkbox').css('border', '1px solid blue');
//查看所有的提交按钮
$(':submit').css('border', '1px solid blue');
//查看所有的图像域
$(':image').css('border', '1px solid blue');
//查看所有的重置按钮
$(':reset').css('border', '1px solid blue');
//查看所有的按钮
$(':button').css('border', '1px solid blue');
//查看所有的文件域
$(':file').css('border', '1px solid blue');
//查看所有的隐藏域tr
$('tr:hidden').css('border', '1px solid blue');
8:表单对象选择器：
//查看所有可以利用的input标签
$('input:enable').css('border', '1px solid blue');
//查看所有不可用的input标签元素
$('input:disabled').css('border', '1px solid blue');
//查看所有选中的复选框
$('input:checked').css('border', '1px solid blue');
//查看所有选中元素的属性
$('select option:selected').css('border', '1px solid blue');