DOM操作の簡略化：
Nodeを入れ替える
指定した2つのNodeを入れ替える。
parentNode.replaceChild(newNode,oldNode) → $replace(newNode,oldNode)
Node1
新しいNodeを指定 id値を文字列で指定してもよい
Node2
古いNodeを指定 id値を文字列で指定してもよい
●必須引数 ●オプション引数(省略可能)
記述例
$replace(nodeArray[0], $id('old_node'))
$replace('item1', 'old_node')
動作サンプル
様々なNodeを入れ替えてみる。
h1：sample1_h1
div：sample1_div
h5：sample1_h5
p：sample1_p
HTML :
<div id="sample1">
<h1 id="sample1_h1">h1：sample1_h1</h1>
<div id="sample1_div">
div：sample1_div
<h5 id="sample1_h5">h5：sample1_h5</h5>
<p id="sample1_p">p：sample1_p</p>
</div>
<nav id="sampe1_nav">nav：sample1_nav</nav>
</div>
Javascript :
$replace('sample1_p','sample1_h5');
$replace('sample1_div','sample1_nav');
$replace('sample1_h1','sample1_p');
$replace('sample1_h1','sample1_div');
※上記のサンプルコードは主にPC表示用を想定している。スマホ用のコーディングでは別途調整が必要となる可能性がある。
※この関数の動作サンプルとして必須ではない装飾的なCSSコードなどは省略して提示している。
※この関数の動作サンプルとして必須ではない装飾的なCSSコードなどは省略して提示している。