JQuery中的html() text() val()區別

1.HTML

html() 取得第一個匹配元素的html內容（標籤+內容）。
html(val) 設定每一個匹配元素的html內容，就是將上一步取得的內容全部替換成括號中val。
注：html()方法可以用於XHTML文件，但不能用於XML文件！
** html()方法使用在多個元素上時，只讀取第一個元素。 **
demo如下：
html頁面程式碼

<div id="textDiv1">
    <span class="textSpan">我是第一個span</span>
    <span class="textSpan">我是第二個span</span>
    <span class="textSpan">我是第三個span</span>
</div>

執行jQuery程式碼

alert($("#textDiv1").html());

得到：

如果執行

alert($(".textSpan").html());

得到

可見，html()方法使用在多個元素上時，只讀取第一個元素。

2.TEXT

text()取得所有匹配元素的內容（僅包括文字，沒有標籤）。
text(val)設定所有匹配元素的文字內容。
** text()用來讀取元素的純文字內容，包括其後代元素，text()方法不能使用在表單元素上。 **
demo如下
html頁面程式碼

<div id="textDiv1">
    <span class="textSpan">我是第一個span</span>
    <span class="textSpan">我是第二個span</span>
    <span class="textSpan">我是第三個span</span>
</div>

執行jQuery程式碼

alert($("#textDiv1").text());

得到

如果執行

alert($(".textSpan").text());

得到

可見，text()是可以作用所有匹配的元素的，但是注意取#textDiv1和取textSpan，結果的顯示形式還是有區別的。

3.VAL

val()val()常用來操作標準的表單元件物件，如button,text,hidden。
val(val)設定每一個匹配元素的值。
demo如下
html程式碼

<select id="selectVal">
    <option value="1" selected="selected">1</option>
    <option value="2" >2</option>
</select>

執行jQuery程式碼

alert($("#selectVal").val()); //取得值為：1 

4.text(val)和html(val)的對比

html頁面程式碼：

<div></div>

jquery程式碼：

$("div").html("<b>Nice to meet you</b>");
//$("div").text("<b>Nice to meet you</b>");

區別立下：

如有不妥，還請斧正！