Beispiel:JS-Array-03.html

<!DOCTYPE html> <html> <head>

 <meta charset="utf-8">
 <meta name="viewport" content="width=device-width, initial-scale=1.0;">
 <link rel="stylesheet" type="text/css" media="screen" href="./Beispiel:Grundlayout.css" />
 <title>Array - 2</title>

<script> 'use strict';

(function () {

 var Mitarbeiter = [
 {
   Name: "Müller",
   Vorname: "Max",
   Alter: 24, // Integer! Kein String!
   Wohnort: "München"
 },
 {
   Name: "Doll",
   Vorname: "Dieter",
   Alter: 25, 
   Wohnort: "Dresden"
 },
 {
   Name: "Schulze",
   Vorname: "Bettina",
   Alter: 26,
   Wohnort: "Berlin"
 }
 ];

function init() { var elem = document.getElementById('button');

if (elem) { elem.addEventListener( "click", function () { ausgeben(); } ); } }

function ausgeben() { var container = document.getElementById("ausgabe"), dl;

if (container) {

dl = container.appendChild( document.createElement("dl") );

Mitarbeiter.forEach(function (m, i) {

var dd, dt, eigenschaft;

dt = document.createElement("dt"); dt.innerHTML = "Mitarbeiter " + (i+1);

dl.appendChild(dt);

for (eigenschaft in m) {

dd = document.createElement("dd"); dd.innerHTML = eigenschaft + ": " + m[eigenschaft];

dl.appendChild(dd); } }); } }

document.addEventListener( "DOMContentLoaded", function () { init(); } );

}()); </script> </head>

<body>

Beispiel: Array - mehrdimensionale Arrays

 <main>

Durch einen Klick auf "Los" gibst du eine Liste unserer Mitarbeiter aus.

   <button type="button" id="button" >Los!</button>

 </main>

</body> </html>