javascript - 有没有更好的方法来创建元素并将文本附加到它们/周围？

Question

我目前有一堆看起来像这样的行:

txt = "Can't print the value for <span class='keyword'>"+arguments[1]+"</span> before it's set";

我在做

$('#mydiv').append($('<div/>').html(txt));

这看起来很糟糕，我需要转义 arguments[1] 中的任何 html

我能想到的唯一选择是确保所有文本都在其自己的元素内:

var spans = [];
spans[0] = $('<span/>').text("Can't print the value for ");
spans[1] = $('<span/>').text(arguments[1]).className('keyword');
spans[2] = $('<span/>').text(" before it's set");
$('#mydiv').append($('<div/>').append(spans[0],spans[1],spans[2]));

这对于一行简单的文本来说已经相当多了。还有什么我可以做的吗？

编辑:这不是模板引擎应该处理的事情。它是由 javascript 日志记录功能生成的 html。

Answer 1

如果格式一致，我会将其添加为普通字符串，然后搜索关键字部分。

$('<div/>')
  .appendTo('#mydiv')
  .html("Can't print the value for <span class='keyword'></span> before it's set")
  .find('.keyword').text(arguments[1]);