nodeList.item( index )メソッド

nodeList.item( index )は、「nodeList」に指定したノードリストのうち、引数「index」に指定したインデックスを持つノードを取得するメソッド。

構文

var $nodeItem = $nodeList.item( index );

引数

index
取得したいノードのインデックスを指定。

戻り値

取得したノード。

ポイント

上記の構文は下のように書いても同じこと。私は下のように書くことが多い。

var $nodeItem = $nodeList[0];

サンプル

  1. 項目A
  2. 項目B
  3. 項目C

サンプルの動作について

  • 「A」ボタンをクリックすると、ボタン群の右横に「項目A」と表示する。
  • 「B」ボタンをクリックすると、ボタン群の右横に「項目B」と表示する。
  • 「C」ボタンをクリックすると、ボタン群の右横に「項目C」と表示する。

サンプルのソースコード

JavaScript

<script type="text/javascript">
var $count = 0;
function sample( $index ) {
    var $nodeList = document.getElementById( "sample" ).childNodes;
    var $elementNodeReference = document.getElementById( "sampleOutput" );
    $elementNodeReference.innerHTML = $nodeList.item( $index ).innerHTML;
}
</script>

HTML

<p>
    <button onclick="sample(0);"></button>
    <button onclick="sample(1);"></button>
    <button onclick="sample(2);"></button>
    <span id="sampleOutput" style="margin-left: 10px;"></span>
</p>
<ol id="sample"><li>項目A</li><li>項目B</li><li>項目C</li></ol>

スポンサード リンク

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