jquery - 如何在 jQuery 中添加文本（不是 HTML）？

Question

我意识到我可以使用以下方法将内容添加到元素中：

$(...).prepend(myText);

但是，如果myText是，比方说，"<span>"我实际上希望该文本出现，而是.prepend()在前面添加一个空的 span 元素。解决此问题的推荐方法是什么？我真的必须手动对文本进行 HTML 转义还是有更优雅的东西？

Answer 1

您可以创建一个文本节点并将内容放在那里，prepend并且：

$('div').prepend(document.createTextNode("<span>"));

示例：http: //jsfiddle.net/niklasvh/gCKHe/

Answer 2

您可以使用该text函数代替prepend，只需将原始文本添加到新文本的末尾即可：

$("#elementID").text("<span>" + $("#elementID").text());

Answer 3

在我看来，HTML 实体没问题：

$(...).prepend('<span>');

您可以使用http://debuggable.com/posts/encode-html-entities-with-jquery:480f4dd6-13cc-4ce9-8071-4710cbdd56cb中的提示自动化实体

$(...).prepend($('<div/>').text('<span>').html());

如果您还想在 Javascript 中创建 PHP 的函数htmlentities，您可以使用 PHP-JS 项目中提供的代码：http ://phpjs.org/functions/htmlentities:425

或者您可以通过将前面的技巧包装在一个函数中来简化：

function htmlentities(string) {
  return $('<div/>').text(string).html();
}

在这两种情况下，您都可以像这样使用 htmlentities 函数：

$(...).prepend(htmlentities('<span>'));

Answer 4

您可以实现 HTML 编码（和解码）功能，就像这个公认的答案： HTML-encoding lost when attribute read from input field

然后做：

$(...).prepend(htmlEncode(myText));