jQuery中的.html()和.text()及.val()區別

1.  .html()

    .html()：獲取集合中第一個匹配元素的HTML內容。這個函數不能用於XML文檔。但能夠用於XHTML文檔

    .html( htmlString )：設置每個匹配元素的html內容。這個函數不能用於XML文檔。但能夠用於XHTML文檔

    .html( function(index, oldhtml))：return設置HTML內容的一個函數。index可選。接收選擇器的 下標 位置；oldhtml可選。接收選擇器的當前內容。

    

2.  .text()

    .text()：獲取匹配元素集合中每一個元素的合併文本內容，包括他們的後代。這個方法對HTML和XML文檔都有效。

    .text( textString )：設置匹配元素內容的文本

    .text( function(index, oldtext))：return設置文本內容的一個函數。index可選。接收選擇器的 下標 位置；oldtext可選。接收選擇器的當前內容。

3.  .val()

    .val()：獲取匹配的元素集合中的第一個元素的當前值

    .val(value)：設置匹配的元素集合中的每一個元素的值

    .val( function(index, oldvalue) ) return設置文本內容的一個函數。index可選。接收選擇器的 下標 位置；oldvalue可選。接收選擇器的當前內容。

　　注意事項：

1.  .html()：方法內部使用的是DOM的innerHTML屬性來處理的，因此在設置與獲取上須要注意的一個最重要的問題，這個操做是針對整個HTML內容（不單單是文本內容，元素標籤也包含在裏面）
2.  .text()：結果返回一個字符串，包含全部匹配元素的合併文本
3.  .val()：
1. 　　經過.val()處理select元素，當沒有選擇項被選中，他返回null
2. 　　.val()方法多用來設置表單的字段的值
3. 　　若是select元素有multiple（多選）屬性，而且至少一個選擇項被選中，.val()方法返回一個數組。這個數組包含每一個選中的選擇項的值

 

　　.html(),.text()和.val()的差別總結：  

 

　　　　.html(),.text(),.val()三種方法都是用來讀取選定元素的內容；

　　　　.html()是用來讀取元素的html內容（包括html標籤）；

　　　　.text()用來讀取元素的純文本內容，包括其後代元素；

　　　　.val()是用來讀取表單元素的"value"值；

　　　　.html()和.text()方法不能使用在表單元素上,而.val()只能使用在表單元素上；

　　　　.html()方法使用在元素集合上時，只讀取第一個元素；.val()方法和.html()相同，若是其應用在元素集合上時，只能讀取第一個表單元素的"value"值，可是.text()不同，若是.text()應用在多個元素上時，將會讀取全部選中元素的文本內容；

　　　　.html(htmlString),.text(textString)和.val(value)三種方法都是用來替換選中元素的內容，若是三個方法同時運用在多個元素上時，那麼將會替換全部選中元素的內容；

　　　　.html(),.text(),.val()均可以使用回調函數的返回值來動態的改變多個元素的內容；