wrap(html)

Manipulation/API/jQuery

各要素を構造的に指定HTMLで囲む。
ドキュメントに追加構造を差し込む際に、その論理的な構成を崩さずに操作を行うことが出来る。
この関数は、渡されたHTMLをその場で解析し、最初の要素から最も深い階層を捜して、そこへ指定要素を挟み込む。
引数に指定するHTMLがテキストを含んでいる場合、この関数はうまく動作しない。その場合はwrap関数実行後にテキスト追加を行うこと。
また、指定HTMLが兄弟構造を持っていたり、逆にwrapされる要素が入れ子関係にあると上手く動作しない。

html: String
HTML文字列

戻り値

jQuery

jQueryオブジェクト

サンプル

サンプル1

p要素を指定HTMLで囲む。

<p>Test Paragraph.</p>

$("p").wrap("<div class='wrap'><b></b></div>");

[全コードを表示] [実行結果を単体で表示]

サンプル2

うまくいかないケース。

<p id="case1">Test Paragraph.</p>
<p id="case2">Test Paragraph <p id="case2-1">and here is a child</p></p>

$("p#case1").wrap("<div class='wrap'><b></b></div><strong></strong>");
$("p#case2,p#case2-1").wrap("<div class='wrap'><b></b></div>");