val()获取匹配的表单元素的第一个值

val(值)用来设置值

val()获取select的值时，当没有选择时返回null

val()如果selected中有多个选中的话，将会返回一个数组，这个数组中包含每个选项的值

:even 和：odd 索引值从0开始计数

html()获取和替换的是整个html文档，而text()只获取或者替换文本节点的值，html()方法实际上是使用innerHTML的方法的，有些浏览器不支持该属性，可以使用text()方法，可以兼容所有浏览器。text(值)可以直接覆盖原来的值，而使用text(function(index,text){return '增加内容'+text})可以获取到之前的内容之后再重新设置

每个元素有一个或者多个附加特性，这些特性来给出相应元素或者内容的附加信息，在img元素中，src就是元素的特性，用来标记图片的地址。操作元素的特性的Dom方法有3种，分别为getAttribute,setAttribute,removeAttribute,，这样还是有很多问题，在jQuery中用一个attr()与removeAttr()就可以解决问题了

attr(属性名)获取值

attr(属性名，属性值)设置属性的值

attr(属性名，函数值):设置属性的函数值

attr(attribute):给定元素设置多个属性值

属性名1：“属性值1”，属性名2：“属性值2”。。。。

removeAttr(attributename)移除一个属性

Dom中attribute叫做属性，id，title，class属性

而Property是这个Dom元素作为对象的附加内容，叫做特性，例如tagName,nodeName,nodeType,nodeValue这些使用属性获取不到，只能通过prop()来获取

总结：attr()来获取设置属性

           prop()来设置获取特性

//查找所有input所有可用的（未被禁用的元素）input元素。

        $('input:enabled').css("border", "2px groove red");

//查找所有input所有不可用的（被禁用的元素）input元素。

        $('input:disabled').css("border", "2px groove blue");

//查找所有input所有勾选的元素(单选框,复选框)

         //移除input的checked属性

        $('input:checked').removeAttr('checked')

//查找所有option元素中,有selected属性被选中的选项

         //移除option的selected属性

        $('input:selected').removeAttr('selected')

注意事项：

1. 选择器适用于复选框和单选框，对于下拉框元素, 使用 :selected 选择器

2. 在某些浏览器中，选择器:checked可能会错误选取到<option>元素，所以保险起见换用选择器input:checked，确保只会选取<input>元素

如果有一个元素，给元素上绑定一个方法，该方法里使用this，this就是表示触发方法的这个元素（button按钮上绑定事件后点击函数中的this表示的是button元素）本身

其实也是一个html元素，可以使用js的属性来设置值

同时如果觉得使用this这种原始的js来设置比较麻烦的话，可以使用$()来将其转换为jquery对象，使用jQuery中的方法

 //匹配所有input元素中的图像类型的元素,修改背景颜色

        $('input:image').css("background", "#F4A460");

//匹配所有input元素中类型为按钮的元素

        $('input:botton').css("background", "red");

//匹配所有input元素中类型为file的元素

        $('input:file').css("background", "#CD1076");

//查找所有 input, textarea, select 和 button 元素

        //:input 选择器基本上选择所有表单控件

        $(':input').css("border", "1px groove red");

//匹配所有input元素中类型为text的input元素

        $('input:text').css("background", "#A2CD5A");

//匹配所有input元素中类型为password的input元素

        $('input:password').css("background", "yellow");

//匹配所有input元素中的单选按钮,并选中

        $('input:radio').attr('checked','true');

//匹配所有input元素中的复选按钮,并选中

        $('input:checkbox').attr('checked','true'); 

//匹配所有input元素中的提交的按钮,修改背景颜色

        $('input:submit').css("background", "#C6E2FF");

//查找class="last-div"下的第二个a元素

        $('.last-div a:nth-child(2)').css("color", "#CD00CD");

//查找class="last-div"下的倒数第二个a元素

        $('.last-div a:nth-last-child(2)').css("color", "red");

//查找class="first-div"下的第一个a元素

        //针对所有父级下的第一个

        $('.first-div a:first-child').css("color", "#CD00CD");

//查找class="first-div"下的最后一个a元素

        //针对所有父级下的最后一个

        //如果只有一个元素的话，last也是第一个元素

        $('.first-div a:last-child').css("color", "red");

//查找class="first-div"下的只有一个子元素的a元素

        $('.first-div a:only-child').css("color", "blue");

注意事项：

1. :first只匹配一个单独的元素，但是:first-child选择器可以匹配多个：即为每个父级元素匹配第一个子元素。这相当于:nth-child(1)

2. :last 只匹配一个单独的元素， :last-child 选择器可以匹配多个元素：即，为每个父级元素匹配最后一个子元素

3. 如果子元素只有一个的话，:first-child与:last-child是同一个

4.  :only-child匹配某个元素是父元素中唯一的子元素，就是说当前子元素是父元素中唯一的元素，则匹配

5. jQuery实现:nth-child(n)是严格来自CSS规范，所以n值是“索引”，也就是说，从1开始计数，:nth-child(index)从1开始的，而eq(index)是从0开始的

6. nth-child(n) 与 :nth-last-child(n) 的区别前者是从前往后计算，后者从后往前计算

表单元素选择器中除了:input匹配所有 input, textarea, select 和 button 元素，其他元素选择器都只是对应单一的一类元素，而且其他元素选择器大部分都可以使用属性选择器来替换，表单对象属性筛选选择器是针对表单对象进行进一步的选择，选择出我们想要的表单元素

表单对象属性筛选选择器有4个，分别为:

:enabled选择所有可用的表单元素

:disabled选择所有不能用的表单元素

:checked选择被选中，如radio,checkbox等表单元素

:selected选择选中的select下拉列表中的元素

:checked最好和input:checked配合使用，确保只会选取input中的元素，不会误选到option中的元素了

子元素选择器中的first-child:选择父元素的第一个子元素，当前面的元素选择是多个的话，可以选择出多个子元素，即每个父元素匹配出一个第一个子元素，first过滤选择器只能选择一个，也就是匹配父元素里的一个元素。first-child和:nth-child(1)效果相同

last-child和last的区别和上面的也差不多，last-child和:nth-last-child(1)的效果差不多

:only-child：就是元素是父元素中的唯一子元素，则把改子元素选择出来，否则不选择

:nth-child,:nth-last-child都是索引从1开始的，这一点和过滤选择器的eq,lt,gt有比较大的区别，他们都是从0开始的。

//查找所有div中，属性name的值是用imooc开头的

         $('div[name^="imooc"]').css("border", "3px groove red");

 //查找所有div中，属性name的值是用imooc结尾的

         $('div[name$=imooc]').css("border", "3px groove blue"); 

//查找所有div中，有属性name中的值包含一个test字符串的div元素

        $('div[name*="test"]').css("border", "3px groove #00FF00"); 

//查找所有div中，有属性testattr中的值没有包含"true"的div

        $('div[testattr!="true"]').css("border", "3px groove #668B8B");