Beispiel:JS-Array-02.html

Aus SELFHTML-Wiki
Wechseln zu: Navigation, Suche

<!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'; var Mitarbeiter = new Array();

   Mitarbeiter[0] = new Object();
   Mitarbeiter[0]["Name"] = "Müller";
   Mitarbeiter[0]["Vorname"] = "Max";
   Mitarbeiter[0]["Alter"] = 24;	
   Mitarbeiter[0]["Wohnort"] = "München";
   Mitarbeiter[1] = new Object();
   Mitarbeiter[1]["Name"] = "Doll";
   Mitarbeiter[1]["Vorname"] = "Dieter";
   Mitarbeiter[1]["Alter"] = 25;	
   Mitarbeiter[1]["Wohnort"] = "Dresden";
   Mitarbeiter[2] = new Object();
   Mitarbeiter[2]["Name"] = "Schulze";
   Mitarbeiter[2]["Vorname"] = "Bettina";
   Mitarbeiter[2]["Alter"] = 26;	
   Mitarbeiter[2]["Wohnort"] = "Berlin";

function init() {

 var elem = document.getElementById('button');
 elem.addEventListener('click', 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', init); </script> </head>

<body>

Beispiel: Array - mehrdimensionale Arrays

 <main>

Durch einen Klick auf "Los" erfährst du alles über unsere Mitarbeiter.

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

</body> </html>