JQuery - 如何添加一个HTML标签到一些HTML？

我想只插入一个<跨度>下面的文本（LINK前右侧）：JQuery - 如何添加一个HTML标签到一些HTML？

<li><a href="">LINK</a></li>

因此，上述成为

<li><a href=""><span>LINK</a></li>

这里是我的jQuery代码：

$('#mainnav li a').prepend('<span>');

当我v查看萤火虫后的代码，我看到，我该如何获得开启span标签而不是结束标签？

来源

2010-05-11 Keith Donegan

庵给我从开发商....究竟为什么你要创建HTML格式不正确？ – cletus 2010-05-11 09:55:44

好吧，我将添加结束标记，我需要先清理开始标记：| – 2010-05-11 09:57:00

你应该重新考虑你的设置。如果它依赖于创建格式不正确的HTML，那么它可能会被重写为更稳固的内容（以及XML/HTMLish）。或者你是否隐藏了我们的特定原因？ – Boldewyn 2010-05-11 10:20:32

首先，你要的是畸形的HTML。如果不是不可能创建它，jQuery将会很难。我会建议一步而不是多次。尝试：

$("li > a").each(function() { 
    $(this).contents().wrapAll("<span>"); 
});

输入：

<ul> 
    <li><a href="...">testing</a></li> 
    <li><a href="...">rich <b>content</b> with <i>inner tags</i></a></li> 
</ul>

输出：

<ul> 
    <li><a href="..."><span>testing</span></a></li> 
    <li><a href="..."><span>rich <b>content</b> with <i>inner tags</i></span></a></li> 
</ul>

来源

2010-05-11 09:59:58 cletus

当您使用prepend时，您并未将标记文本添加到页面，而是将元素添加到页面。元素没有“开始”和“结束”标签，元素是元素。如果你想在span中包装一堆元素（我猜这就是你想要的，如果你想在一个地方插入它的开头，并在另一个地方插入它的结尾），你需要添加跨度到容器，然后将元素移入其中。

例如，这会将所有链接到元件foo，并将其移动到一个跨度内container：

var stuff; 
var container; 

stuff = $('#foo a'); 
span = $("<span style='background-color: yellow'>"); 
span.append(stuff); 
$('#container').append(span);

来源

2010-05-11 09:59:08

我不知道为什么你想要它，但它可以做到这样，

$('#mainnav li a').html(function(i,v){ 
    return '<span>' + v; 
})

来源

2010-05-11 10:03:57 Reigel

许多jQuery方法被设计为仅从一半中自动创建元素对于.prepend（），例如，""将导致整个span元素被添加到DOM。或者，您将在Firebug中看到它，""首先插入到锚元素中。

我不明白你为什么会想创建无效的HTML，但如果你一定要，你可以这样来做：

$("li > a").html("<span>"+$("li > a").html());

或者，如Reigel表明，一个匿名函数来html的（）方法（我相当快写我的回答，很明显，unthoughtfully）：

$("li > a").html(function (idx, html) { 
    return "<span>" + html; 
});

，否则，可能似乎是你想包装锚元素的内容跨度。在这种情况下，你应该使用的jQuery wrapping methods之一：

$("li > a").wrap("<span>");

你不是要同时创建开始元素和闭合件自己（使用jQuery的时候）。

来源

2010-05-11 10:11:47

我遇到了一个问题，我使用的第三方API使用PHP curl将平面HTML放入我的网页。在返回的api HTML中有一些格式不正确的span标签，这些标签在IE中只能使我的渲染失效。我用Jquery的replaceWith（）函数来解决这个问题。这里有一个例子：

畸形的HTML：（注意，未开封span标签）

<a class="aa_float_right aa_navlink" href="http:whatever">My Account</a></span>

我的解决办法：

$('.aa_navlink').replaceWith('<span class="test"><a class="aa_float_right aa_navlink" href="http:whatever">My Account</a>');

生成的HTML：

<span class="test"><a class="aa_float_right aa_navlink" href="http:whatever">My Account</a></span>

BOOM我们现在有很好形成HTML不用谢谢如此糟糕的第三方API（我的意思是非常糟糕）。

此修复程序在SaltWater Co.

来源

2012-10-01 14:59:36 Brendan

JQuery - 如何添加一个HTML标签到一些HTML？

回答

相关问题