jQuery: text()和html()有什么区别?

jQuery中的text()和html()函数有什么区别?

$("#div").html('<a href="example.html">Link</a><b>hello</b>');

$("#div").text('<a href="example.html">Link</a><b>hello</b>');

当前回答

奇怪的是，没有人提到.text()相对于.html()的跨站点脚本预防好处(尽管其他人刚刚提到。text()转义数据)。

当你想要更新DOM中的数据时，总是建议使用.text()，这只是用户可以看到的数据/文本。

. HTML()应该主要用于获取div中的HTML内容。

2015-08-06 23:49:09

其他回答

我认为这种差异是不言而喻的。测试起来非常简单。

jQuery.html()将字符串处理为HTML, jQuery.text()将内容处理为文本

<html>
<head>
  <title>Test Page</title>
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
  <script type="text/javascript">
    $(function(){
      $("#div1").html('<a href="example.html">Link</a><b>hello</b>');
      $("#div2").text('<a href="example.html">Link</a><b>hello</b>');
    });
  </script>
</head>

<body>

<div id="div1"></div>
<div id="div2"></div>

</body>
</html>

jQuery API文档中描述了一个可能不太明显的区别

在.html()的文档中:

.html()方法在XML文档中不可用。

在.text()的文档中:

与. HTML()方法不同，.text()可以在XML和HTML文档中使用。

$(函数(){ $ (" # div1 ") . html(“< a href = " html”显示>链接< / > < b > < / b >你好'); $ (" # div2”)。文本(' < a href = " html”显示>链接< / > < b > < / b >你好'); })； < script src = " https://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js " > < /脚本> < div id = " div1 " > < / div > < div id = " div2 " > < / div > 现场演示http://jsfiddle.net/hossain/sUTVg/

2009-12-15 22:19:46

实际上，两者看起来有点相似，但却有很大的不同，这取决于你的用法或你想要达到的目的，

使用地点:

使用. HTML()对含有HTML元素的容器进行操作。使用.text()修改元素的文本，通常有单独的打开和结束标签

不使用的地方:

.text()方法不能用于表单输入或脚本。 .val()用于输入或文本区域元素。 .html()表示脚本元素的值。从.text()中获取html内容将把html标记转换为html实体。

的区别:

.text()可以在XML和HTML文档中使用。 . HTML()仅用于HTML文档。

检查jsfiddle上的这个示例，以查看操作上的差异

例子

2012-12-17 08:25:24

第一个例子实际上将HTML嵌入到div中，而第二个例子将转义文本，方法是将与元素相关的字符替换为相应的字符实体，以便按字面意思显示(即HTML将被显示而不呈现)。

2009-12-15 22:17:52

$('.div'). HTML (val)将设置所有选定元素的HTML值，$('.div').text(val)将设置所有选定元素的文本值。

jQuery.text()的API文档

jQuery.html()的API文档

我猜它们分别对应于node# textContent和Element#innerHTML。(Gecko DOM参考)。

2009-12-15 22:23:54

text()方法实体-转义传入它的任何HTML。当您想要插入对查看页面的人可见的HTML代码时，请使用text()。

从技术上讲，第二个示例生成:

&lt;a href="example.html"&gt;Link&lt;/a&gt;&lt;b&gt;hello&lt;/b&gt;

它将在浏览器中呈现为:

<a href="example.html">Link</a><b>hello</b>

您的第一个示例将呈现为一个实际的链接和一些粗体文本。

2009-12-15 22:20:31

jQuery: text()和html()有什么区别?

推荐文章

最新文章

标签