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

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

vs

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

当前回答

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

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

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

其他回答

.text()将为您提供HTML标记之间的实际文本。例如,p标记之间的段落文本。值得注意的是,它将为您提供使用$选择器所瞄准的元素中的所有文本,以及所选元素的子元素中的所有文本。如果你在body元素中有多个带有文本的p标签,你执行$(body).text(),你将获得所有段落的所有文本。(只有文本,而不是p标签本身。)

.html()将为您提供文本和标记。$(body).html()会给你整个HTML页面

.val()适用于具有value属性的元素,例如input。 输入不包含文本或HTML,因此.text()和. HTML()对于输入元素都将为空。

我认为区别在于插入html标签 在text()中你的HTML标签没有函数

$('#output').html('You are registered'+'<br>'  +'  '
                     + 'Mister'+'  ' + name+'   ' + sourname ); }

输出:

You are registered <br> Mister name sourname

用html()替换text()

输出

You are registered
Mister name sourname 

那么标签<br>在html()中工作

不同的是.html()评估为html, .text()评估为文本。 考虑一个html块 超文本标记语言

<div id="mydiv">
<div class="mydiv">
    This is a div container
    <ul>
      <li><a href="#">Link 1</a></li>
      <li><a href="#">Link 2</a></li>
    </ul>
    a text after ul
</div>
</div>

JS

var out1 = $('#mydiv').html();
var out2 = $('#mydiv').text();
console.log(out1) // This output all the html tag
console.log(out2) // This is output just the text 'This is a div container Link 1 Link 2 a text after ul'

插图来自这个链接http://api.jquery.com/text/

text函数将值设置或检索为纯文本,否则,HTML函数将值设置或检索为HTML标记,以更改或修改该值。 如果你只想改变内容,那么使用text()。但是如果你需要改变标记,那么你必须使用hmtl()。

这对我来说是个愚蠢的答案,别介意。

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