htmlページの配列からの出力

Question

配列内の配列の内容をHTMLページの小さな領域に出力しようとしています。私は1次元配列を出力することしかできません。

簡略化すると、目的の配列にはいくつかのプロパティがありますが、配列内にネストされた配列を出力する正しいコードを見つけるのは難しいです。

プロパティは次のとおりです。 ID（整数） 場所（文字列） ポストコード（文字列） 他のプロパティを追加できます。私は次のコードを使用していた情報を出力するには

（私は、単一のアレイ上で動作するように取得することができます - 私は変更する場合でも、使用には、[I] [X]）

document.write("<tr><td>ID " + i + " is:</td>");

document.write("<td>" + LocationArray[i] + "</td></tr>");

情報を格納して特定の部分を出力できるアレイを正しく作成するにはどうすればよいですか？例えばLocationArray [2] [3]の内容を表示する

document.writeは効率的な方法ですか、それとも良い点がありますか？

Answer 1

私は何か一緒に、あなたを助けることができます。最後にあなたの質問に答えて、正しい方法で配列を作成してください。 2つの可能性がある。

• は「property'ベースのプロパティを持つ配列を作成します。
  var locationsArray = [{ID:123,Location:'blabla',Postalcode:'1234'}];
• 文字列のキーを持つ配列を作成します。私の例では
  var locationsArray = [{'ID':123,'Location':'blabla','Postalcode':'1234'}];

を私が最初に使用しました試みる。

document.writeは、ドキュメントの末尾に書きます。ウェブサイトの特定の領域に書きたい場合は、コンテナ（たとえば）を作成し、idとします。私の例のように、作成したコンテナのプロパティinnerHTMLを変更します。

HTML：

<div id="locations"></div> 
<button onclick="printLocations()">Print Locations</button> 

Javascriptを：

function printLocations() { 
    var locationsArray = [{ 
    ID : 123, 
    Location : 'Candyland', 
    Postalcode : '1234' 
    }, { 
    ID : 456, 
    Location : 'Middle-Earth', 
    Postalcode : '4567' 
    } 
    ]; 

    var locationsHtml = ''; 
    for (var index in locationsArray) { 
     locationsHtml += 'ID: ' + locationsArray[index].ID + ', ' + 
         'Location: ' + locationsArray[index].Location + ', ' + 
         'Postalcode: ' + locationsArray[index].Postalcode + '<br />'; 
    } 
    console.log(locationsHtml); 
    document.getElementById('locations').innerHTML = locationsHtml; 
} 

あなただけのだけの使用配列（あなたの例ではただ一つの特定の場所）の特定の部分を書きたい場合インデックスを作成し、私の例のforループと同じ方法でアクセスしてください：

var locationsHtml = locationsArray[1].ID + locationsArray[1].Location + etc...; 
    /*with string-keys: var locationsHtml = locationsArray[1]['ID'] + etc...;*/ 
    document.getElementById('locations').innerHTML = locationsHtml;