配列の内容を、Array.forEachメソッドやDOM操作で順序リスト(ol要素)に表示

array.forEach( callback )メソッドとDOM操作で、配列の全要素を順序リスト(ol要素)に表示するサンプル。

実装例

ソースコード

JavaScript

<script type="text/javascript">
window.onload = function () {
    document.getElementById( "sample" ).innerHTML = displayList( $sampleArray );
}
function displayList( $arr ) {
    var $list = '<ol>\n';
    $arr.forEach( function ( $value, $index ) {
            $list += '<li>';
            $list +=  '$value[' + $index + ']: ' + $value;
            $list += '</li>';
    } );
    $list += '</ol>';
    return $list;
}
var $sampleArray = new Array( '要素1', '要素2', '要素3', '要素4', '要素5' );
</script>

HTML

<div id="sample"></div>

スポンサード リンク

カテゴリー: JavaScript, リスト, 逆引き, 配列 パーマリンク