在 jQuery 中,我们可以使用 text() 方法来获取和设置一个元素的“文本内容”。

图 1:html() 和 text() 效果的区别
语法:
$().text() //获取文本内容
$().text("文本内容") //设置文本内容
text() 方法和 innerText 属性的效果是一样的,只不过 text() 是 jQuery 中的实现方式,而 innerText 是 JavaScript 中的实现方式。
举例:html() 与 text() 比较
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script src="js/jquery-1.12.4.min.js"></script>
<script>
$(function () {
var strHtml = $("p").html();
var strText = $("p").text();
$("#txt1").val(strHtml);
$("#txt2").val(strText);
})
</script>
</head>
<body>
<p><strong style="color:hotpink">C语言中文网</strong></p>
html()是:<input id="txt1" type="text" /><br/>
text()是:<input id="txt2" type="text" />
</body>
</html>
预览效果如图 1 所示。

图 1:html() 和 text() 效果的区别
从这个例子可以看出,html() 获取的是元素内部所有的内容,而 text() 获取的仅仅是文本内容。此外,val() 方法用于获取和设置表单元素的 value 值,我们在后面会详细介绍。
对于 html() 和 text() 这两个方法的区别,从表 1 就可以很清晰地比较出来。
| HTML代码 | html() | text() |
|---|---|---|
| <div>C语言中文网</div> | C语言中文网 | C语言中文网 |
| <div><em> C语言中文网 </em></div> | <em>C语言中文网</em> | C语言中文网 |
| <div><em></em></div> | <em></em> | (空字符串) |
原创文章,作者:奋斗,如若转载,请注明出处:https://blog.ytso.com/tech/pnotes/23816.html