.insertBefore()【要素前 挿入 (要素指定)】

メモ

構文

説明構文戻り値
要素前 挿入 (要素指定) .insertBefore( target ) 1.0

Selector  | htmlString  | Element  | Array  | jQuery   target:挿入対象要素
jQuery

関連

<style>
.border { border:1px black solid; padding:1px 5px; }
.border2 { border:2px red dashed; padding:3px 5px; line-height:225%; }
.color1 { color:red; }
.bold { font-weight:bold; }
</style>

<span id="id0" class="bold border2">(jQuery [id0])</span>

<p><span id="id1" class="border">[id1]</span></p>
<p><span id="id2" class="border">[id2]</span></p>
<p><span class="classA border">[classA]</span></p>
<p><span class="classB border">[classB]</span></p>
<p><span class="classC border">[classC]</span></p>
<p><span class="classX border">[classX]-1</span></p>
<p><span class="classX border">[classX]-2</span></p>
<p><span class="classX border">[classX]-3</span></p>

<script>
$("<span class='color1 border2'>(Selector)</span>").insertBefore( "#id1" );
var elm = document.getElementById("id2");
$("<span class='border2'>(Elemnt)</span>").insertBefore(elm);
$("<span class='border2'>(Array)</span>").insertBefore( [ ".classA", ".classB", ".classC" ] );
$("#id0").insertBefore( $(".classX") );
</script>
(jQuery [id0])

[id1]

[id2]

[classA]

[classB]

[classC]

[classX]-1

[classX]-2

[classX]-3