jquery - jQueryの高度な追加方法

Question

したがって、私の dom<div id="test">random text goes here</div>は div を生成します。次のように、この div 内にスパン タグを jquery で挿入できます。<div id="test"><span>random text goes here</span></div>

Answer 1

wrapInner以下のような関数を使ってみてください。

$('#test').wrapInner('<span/>');

Answer 2

または、内部のものを完全に制御したい場合（メソッドにもいくつかの変更を加えたい場合など）、次のように使用できます。

$("div#test").append(function () {
    //you can refer to the object you are making modifications in as 'this'
    var txt = $(this).text();
    //do your modifications for the 'txt' if needed
    //..
    //finally use return statement to return the value or
    //object you need to the original append function
    //$("<span>") creates a span html element
    return $("<span>").text(txt);
});

---

この質問は、wrapInner() メソッドを使用する多くの人によって回答されています。関数内で「魔法」を作成する方法をお見せしたかっただけです。

Answer 3

wrapInner()メソッドを探しています。

Answer 4

絶対に、チェックしてください$.wrapInner()：

ラッピング要素

/* Wrap an HTML structure around the content of each matched element */
$("#test").wrapInner("<span>");

コールバック関数

または、無名関数を使用して、もう少し制御することもできます。

$("#test").wrapInner(function() {
  return '<span class="' + this.id + '" />';
});

idクラス名として値を適用します：

<div id="test">
  <span class="test">random text goes here</span>
</div>

Answer 5

$.wrapInnerこのように使う

$('#test').wrapInner('<span/>');

Answer 6

他の人が答えたように、使用できますwrapInner。htmlそれ以外の場合は、メソッドを使用するだけで実行できます

$('#test').html($('<span>').html($('#test').html()));

フィドル: http://jsfiddle.net/zcg9B/