element.innerHTML + =的jQuery快捷方式？

Question

在原生DOM搜索中，我可以这样做：

document.getElementById('id').innerHTML+= "text";

在今天的jQuery中，我必须这样做：

$("#id").html($("#id").html()+"text");

（显然我应该缓存元素，但这不是重点。）

所以我想知道jQuery是否有+ =快捷方式。

Answer 1

如果你想在最后添加一大块HTML，你会说：

$('#id').append( "<p>whatever</p>" );

如果你想添加纯文本（如上所述），或者像那样看起来像的文本，但不应该这样解释：

$('#id').append( document.createTextNode( "text" ) );

Answer 2

您可以使用 append() ：$("#id").append('text');

Answer 3

尝试

$("#id").html(function(i, o) {
  return o + "text";
});

jsfiddle http://jsfiddle.net/guest271314/7ExW4/

请参阅http://api.jquery.com/html/

Answer 4

如果您想要易用性（有时是最重要的因素），请使用.append()。

如果您想获得最佳效果，请使用.innerHTML或jQuery .html()，或者至少只调用.append()一次。

从this benchmark可以看出，多次调用.append()非常非常昂贵。准备要添加到变量中的内容然后一次追加/添加该变量要快得多。