如何在jQuery选择器中更轻松地使用+ =？

Question

我从JS Bin中获取了以下示例：

的HTML

<p id='js'>Hello, World!</p>`

的JavaScript

document.getElementById('js').innerHTML += ' – this was inserted using JavaScript';`

现在，我想对jQuery做同样的事情。 由于我找不到在jQuery选择器上使用+ =的方法（否则我不会问这个问题），这是很长的路要走：

var js = $('#js').html() + ' – this was inserted using JavaScript';
$('#js').html(js);

我使用jQuery，因为它的语法更短，更简单。 但是，这两个代码的长度几乎相同。

这不起作用：

$('#js').innerHTML += ' – this was inserted using JavaScript';

Answer 1

$('#js').append(' – this was inserted using JavaScript');

Answer 2

使用jQuery，您可以改用append 。

您的$('#js').innerHTML += ' – this was inserted using JavaScript'; 可以与[0]一起使用，例如：

$('#js')[0].innerHTML += ' – this was inserted using JavaScript';
//      ^^^--- here

...因为您可以通过这种方式访问​​原始DOM元素。 但是，通过innerHTML附加内容是一个坏主意，因为它会使浏览器非常难工作：首先，它必须循​​环遍历其内部DOM，将其序列化为HTML字符串，然后必须在您输入以下内容后重新解释新的HTML。已经完成了+= 。 （授予后者确实非常快，因为将HTML呈现到其内部结构是浏览器的工作，并且浏览器对此进行了高度优化，但前者可能根本不够快。）