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>

面白いことに、の代わりに「新しいテキスト」を使用すると、次のようになります。

<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>これは、これらのメソッドの適切な使用法ではありません。

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);