jquery - jQuery .append 和 .prepend 问题

Question

我有一些html：

<div class="sample">
  <span>
    Text
  </span>
</div>

我想<a href>在文本周围加上一个。

所以我有一些javascript：

$(".sample span").prepend("<a href='http://www.example.com" target='_blank'>");
$(".sample span").append("</a>");

但结果是我得到：

<div class="sample">
  <span>
    <a href='http://www.example.com' target='_blank'></a>
    Text
  </span>
</div>

有趣的是，如果我只使用 'New Text' 而不是 ，我会得到以下信息：

<div class="sample">
  <span>
    New Text
    Text
    New Text
  </span>
</div>

知道为什么要改变这个吗？

Answer 1

你可以使用wrapInner方法：

$(".sample span")
    .wrapInner("<a href='http://www.example.com' target='_blank'></a>");

http://jsfiddle.net/Fz3As/

请注意，您的方法中存在语法错误，您prepend无法将 a 传递</a>给这些方法以添加结束标记。这不是这些方法的正确用法。

Answer 2

你可以使用wrap()方法

$(".sample span").wrap("<a href='http://www.example.com' target='_blank'></a>");

API 参考：http ://api.jquery.com/wrap/

Answer 3

尝试这个

var prepend = "<a href='http://www.example.com' target='_blank'>";
var append  = "</a>";
$(".sample span").html(prepend + $(".sample span").html() + append);