element.removeChild( childNode )メソッド

element.removeChild( childNode )は、「element」に指定した要素の子ノードのうち、引数「childNode」に指定したノードを削除するメソッド。

構文

var $removedNode = $elementNodeReference.removeChild( childNode );

引数

childNode
削除するノードを指定。

戻り値

削除したノード。引数「childNode」と同じ。

サンプル

  1. 項目A
  2. 項目B
  3. 項目C
  4. 項目D
  5. 項目E

サンプルの動作について

「1つ目の項目を削除」ボタンをクリックすると、ボタンの下のリストの1つ目の項目である「項目A」を削除する。

「1つ目の項目を削除」ボタンをクリックする度に、1つ目の項目を削除する。

サンプルのソースコード

JavaScript

<script type="text/javascript">
function sample() {
    var $elementNodeReference = document.getElementById( "sample" );
    $elementNodeReference.removeChild( $elementNodeReference.childNodes[0] );
}
</script>

HTML

<p><button onclick="sample();">1つ目の項目を削除</button></p>
<ol id="sample"><li>項目A</li><li>項目B</li><li>項目C</li><li>項目D</li><li>項目E</li></ol>

スポンサード リンク

カテゴリー: DOM, Elementオブジェクト, JavaScript, ノード, メソッド, リファレンス, 逆引き パーマリンク