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>");

区别立下：

html()结果 text()结果

如有不妥，还请斧正！