jQuery：在元素的HTML之前追加项目

Question

我需要在元素的现有HTML之前附加一些HTML。 我努力了：

$("p").each(function(index){
  $(this).prepend('HELLO! ');
});

但这会将其放在<p>之前。

我也尝试过：

$(this).html().prepend('HELLO! ');

我需要得到的结果如下所示：

<p>HELLO! This is existing text</p>

有人知道这样做的最好方法吗？

Answer 1

您可以使用.html( function )更新所有<p>元素的innerHTML 。

$('p').html(function(i, old) {
    return 'HELLO! ' + old;
});

 $('p').html(function(i, old) { return 'HELLO! ' + old; }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <p>World!</p> <p>TJ</p> 

如果所有<p>元素仅包含普通文本而不是HTML，则也可以使用.text( function )代替.html() 。

Answer 2

 $("p").each(function(index){ $(this).before('HELLO! '); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <p>paragraph</p> <p>paragraph</p> 

使用.before（）

说明：将参数指定的内容插入到匹配元素集中的每个元素之前。