jquery wrapInnerメソッド

TOPページに戻る > jquery入門

jquery wrapInner()メソッド

wrapInnerメソッドは、セレクタで指定した要素の子要素を引数に指定した要素で囲みます

$("囲われる要素").wrapInner("囲う要素")

結果的に囲われる要素の子要素やテキストが親要素を作ります

指定したHTML要素の子要素やテキストを引数に指定した要素で囲みます

jquery

$(function() {
	$("span.hoge").wrapInner("<b></b>");
});

html

<span><i>囲まれる要素</i></span>
<br>
<span><i>囲まれる要素2</i></span>
<br>
<span><i>囲まれる要素3</i></span>

実行前

囲まれる要素
囲まれる要素2
囲まれる要素3

実行後

囲まれる要素
囲まれる要素2
囲まれる要素3

実行後のhtml

実行後は要素の子要素を引数で指定した要素で囲っています

<span class="hoge"><b><i>囲まれる要素</i></b></span>
<br>
<span class="hoge"><b><i>囲まれる要素2</i></b></span>
<br>
<span class="hoge"><b><i>囲まれる要素3</i></b></span>