HTML・レイアウトの操作:

Node内部の改行コードとTABコードを削除

<li>を「display: inline」に設定したり、ブロック要素を「display: inline-block」に設定すると、その前後に改行コードやTABコードがあると数pxの隙間ができるので、これらのコードを削除してHTMLに差し込み直す。

Node
Nodeを指定 個別の引数として複数を指定可能
または、id値かclass値を渡す 複数を指定可能 ❶半角スペースで区切って ❷個別の引数として
●必須引数 ●オプション引数(省略可能)

記述例

$removeNLTFrom($id('id1'))
$removeNLTFrom($id('id1'), $id('id2'))
$removeNLTFrom('id1')
$removeNLTFrom('id1 class1')
$removeNLTFrom('id1', 'class1', 'class2')

注意点

隙間が発生している要素Nodeを指定するのではなく、それを含んでいる親Nodeを指定する点に注意。

動作サンプル

  • id1の子Node
  • id1の子Node
  • id1の子Node
  • id2とclass1の子Node
  • id2とclass1の子Node
  • id2とclass1の子Node
id3とclass2の子Node id3とclass2の子Node id3とclass2の子Node
HTML : <ul id="id1"> <li>id1の子Node</li> <li>id1の子Node</li> <li>id1の子Node</li> </ul> <ul id="id2" class="class1"> <li>id2とclass1の子Node</li> <li>id2とclass1の子Node</li> <li>id2とclass1の子Node</li> </ul> <div id="id3" class="class2"> <span>id3とclass2の子Node</span> <span>id3とclass2の子Node</span> <span>id3とclass2の子Node</span> </div>
Javascript : $removeNLTFrom('id1'); $removeNLTFrom('class2'); $removeNLTFrom('id2 id3');
※上記のサンプルコードは主にPC表示用を想定している。スマホ用のコーディングでは別途調整が必要となる可能性がある。
※この関数の動作サンプルとして必須ではない装飾的なCSSコードなどは省略して提示している。