nodeList.lengthプロパティ

nodeList.lengthは、「nodeList」に指定したノードリストのノード数を返すプロパティ。

構文

var $nodeItem = $nodeList.length;

戻り値

ノードの数。

サンプル

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

サンプルの動作について

  • 「ノード数を数える」ボタンをクリックすると、ボタンの右横に現在のリスト項目の数を表示する。
  • 「リスト項目追加」ボタンをクリックする度に、「新項目1、新項目2、新項目3」のように連番付きで項目を追加する。

サンプルのソースコード

JavaScript

<script type="text/javascript">
function sampleCount() {
    var $nodeList = document.getElementById( "sample" ).childNodes;
    var $elementNodeReference = document.getElementById( "sampleOutput" );
    $elementNodeReference.innerHTML = $nodeList.length;
}
var $count = 1;
function sampleAdd() {
    var $newElement = document.createElement( "LI" );
    var $textNode = document.createTextNode( "新項目" + $count++ );
    $newElement.appendChild( $textNode );
    var $elementNodeReference = document.getElementById( "sample" );
    $elementNodeReference.appendChild( $newElement );
}
</script>

HTML

<p>
    <button onclick="sampleAdd();">リスト項目追加</button>
    <button onclick="sampleCount();">ノード数を数える</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, ノード, プロパティ, リファレンス, 逆引き パーマリンク