jQuery基础系列（二）：jQuery属性操作方法

关于此模块分为三个部分来写：

1. 元素属性操作方法
2. 元素CSS类操作方法
3. 元素HTML代码/文本/值操作方法

一：元素属性操作方法（下面读取，设置或移除的属性都是要在行内有的属性）

1.attr( ) 设置或读取元素属性，可读可写，检索HTML属性

//语法$(selector).attr(attribute)  //读取$(selector).attr(attribute,value)  //设置$(selector).attr(attribute,function(index,oldvalue))  //index为选择器index值，oldvalue为原来属性值$(selector).attr({attribute:value, attribute:value ...})//eg$('img').attr('width')$('img').attr('width','300')$('img).attr('width',function(index,oldvalue){    return oldvalue-50;})$('img').attr({'width':'300','height':'300'})

2.removeAttr( ) 移除元素属性

//语法$(selector).removeAttr(attribute)//eg$('p').removeAttr('id')

3.prop( ) 设置或读取元素属性，可读可写，检索DOM属性

//语法$(selector).prop(property)  //读取$(selector).prop(property,value)  //设置$(selector).prop(property,function(index,currentvalue))  //index为选择器index值，oldvalue为原来属性值$(selector).prop({property:value, property:value ...})//eg$('img').attr('width')$('img').attr('width','300')$('img').attr('width',function(index,oldvalue){    return oldvalue-50;})$('p').attr({'width':'300','height':'300'})

4.removeProp( ) 移除元素属性

//语法$(selector).removeProp(property)//eg$('p').removeProp('id')

二：元素CSS类操作方法

1.addClass( ) 给元素添加一个或多个类

//语法$(selector).addClass(class)$(selector).addClass(function(index,oldclass))//eg$('p').addClass('intro')

2.removeClass( ) 删除元素一个或多个类

//语法$(selector).removeClass(class)$(selector).removeClass(function(index,oldclass))//eg$('p').removeClass('intro')

3.toggleClass( ) 切换添加或者移除元素一个或多个类

//语法$(selector).toggleClass(class)$(selector).toggleClass(classname,function(index,currentclass),switch)   //switch参数控制只添加（true）或只删除（false）类//eg$('p').toggleClass('intro')$('p').toggleClass('intro',false)

三：元素HTML代码/文本/值操作方法

1.html( ) 设置或返回第一个匹配元素的html内容，不包含标签

//语法$(selector).html()  //读取$(selector).html(content)  //设置$(selector).html(function(index,oldcontent))//eg$('p').html()$('p').html('Hello <b>world!</b>')  //Hello world，world会加粗，标签会起作用

2.text( ) 设置或返回所有匹配元素的html内容，包含标签

//语法$(selector).text()  //读取  $(selector).text(content)  //设置$(selector).text(function(index,oldcontent))//eg$('p').text()$('p').text('Hello <b>world!</b>')  //Hello <b>world!</b>

3.val( ) 返回第一个匹配元素的 value 属性的值，主要用于表单元素

//语法$(selector).val()  //读取$(selector).val(value)  //设置$(selector).text(function(index,oldvalue))//eg$('input').val()$('input').val('设置表单元素value属性值')  //Hello <b>world!</b>

以上通过函数进行操作中的index值皆表示选择器的 index 位置，old表示元素之前的，current表示当前，这些参数都是可选