Question

我有一些导航链接：

<ul class="nav">
 <li>
  <a class="active">linkname</a>
 <li>
</ul>

现在我需要在“linkname”之后直接添加额外内容，如下所示：

<ul class="nav">
 <li>
  <a class="active">linkname<b class="caret"></b></a>
 <li>
</ul>

如何在特定文本后直接添加元素（div，span，b）？

Answer 1

尝试.append()

$('ul.nav a.active').append('<b class="caret"></b>');

fiddle Demo

Answer 2

$('a.active').html($('a.active').text() + '<b class="caret"></b>');

更新

不知道这个问题是否如何在文本之间插入一个元素

<a class="active">link<b class="caret">BOLD</b>name</a>

所以我尝试了

String.prototype.splice = function (idx, rem, s) {
    return (this.slice(0, idx) + s + this.slice(idx + Math.abs(rem)));
};

var text = $('a.active').text();
var ind = text.indexOf('name'); //specify where to add the text
var result = text.splice(ind, 0, '<b class="caret">BOLD</b>');
$('a.active').html(result);

从@user113716's answer获得 protoype splice 。

<强> JSFiddle

Answer 3

$("a.active").append("<b class='caret'></b>");

Answer 4

尝试：

append()将内容插入匹配元素集中每个元素的末尾。

$(".nav .active").append("<b class='caret'></b>");

Answer 5

你可以使用.append（）

喜欢：

<ul class="nav">
  <li>
    <a id="myelement" class="active">linkname<b class="caret"></b></a>
  <li>
</ul>

的javascript：

$("#myelement").append("whatever you want to add after linkname");

Answer 6

尝试使用.html（）并替换，如果您需要在linkname

之类的文本之后专门添加元素

$('.active').html(function(){
  return this.innerHTML.replace("linkname","linkname" + '<b class="caret"></b>');
});

DEMO

Answer 7

您可以像这样使用append：

$('a.active').append('<b class="caret"></b>');

或者像这样：

var b = '<b class="caret"></b>';
var a = $('a.active');
b.appendTo(a);

或者像这样：

$('a.active').append($('b.caret'));

Answer 8

快速测试表明，这应该可以胜任：

var c = '<b class="caret"></b>';
$(".active").append(c);

或作为oneliner ......

$(".active").append('<b class="caret"></b>');

Answer 9

试试这个：

 var ele = document.querySelector("a.active");
     ele.innerHTML += "<b class="caret"></b>";

jQuery - 在文本后添加元素

9 个答案:

更新