Ein Array der Länge 9 soll zweizeilig nach folgendem Schema ausgegeben werden (angezeigt werden die Indizes des Arrays):
0 2 4 6 8
1 3 5 7
/* ****************************************************************************************** * * Das Script kann frei verwendet werden, dieser Kommentar sowie die Nennung des Nicks * müssen jedoch erhalten bleiben. * * Quaese (www.quaese.de), 2014 * ****************************************************************************************** */ var files = [ {'name': 'eins.txt', 'date': '01.02.03', 'size': 100}, {'name': 'zwei.txt', 'date': '29.02.03', 'size': 300}, {'name': 'drei.txt', 'date': '12.02.03', 'size': 200}, {'name': '4.txt', 'date': '29.02.03', 'size': 300}, {'name': '5.txt', 'date': '12.02.03', 'size': 200}, {'name': '6.txt', 'date': '29.02.03', 'size': 300}, {'name': '7.txt', 'date': '12.02.03', 'size': 200}, {'name': '8.txt', 'date': '29.02.03', 'size': 300}, {'name': '9.txt', 'date': '12.02.03', 'size': 200}, {'name': '10.txt', 'date': '29.02.03', 'size': 300}, {'name': '11.txt', 'date': '12.02.03', 'size': 200}, {'name': '12.txt', 'date': '29.02.03', 'size': 300}, {'name': '13.txt', 'date': '12.02.03', 'size': 200}, {'name': '14.txt', 'date': '29.02.03', 'size': 300}, {'name': '15.txt', 'date': '12.02.03', 'size': 200}, {'name': '16.txt', 'date': '29.02.03', 'size': 300}, {'name': '17.txt', 'date': '12.02.03', 'size': 200}, {'name': '18.txt', 'date': '29.02.03', 'size': 300}, {'name': '19.txt', 'date': '12.02.03', 'size': 200}, {'name': '20.txt', 'date': '29.02.03', 'size': 300}, {'name': '21.txt', 'date': '12.02.03', 'size': 200}, {'name': '22.txt', 'date': '29.02.03', 'size': 300}, {'name': '23.txt', 'date': '12.02.03', 'size': 200}, {'name': '24.txt', 'date': '29.02.03', 'size': 300}, {'name': '25.txt', 'date': '12.02.03', 'size': 200} ], insertDiv = function(wrapper, file){ // neues Element erstellen var div = document.createElement('div'), content = "", _key; for(_key in file){ if(file.hasOwnProperty(_key)){ content += _key + ": " + file[_key] + "<br />"; } } // dem neuen Element Inhalt zuweisen div.innerHTML = content; // CSS-Eigenschaften über das style-Objekt (z.b. inline-block) div.style.display = "inline-block"; // CSS über Klasse zuweisen div.className += " metro-div"; wrapper.appendChild(div); }; window.onload = function(){ var wrapper = document.getElementById('wrapper'), tmp = [], count = 0, rows; // wrapper initialisieren // 1. Anzahl Zeilen rows = 2; // 2. Ausgabe-Matrix erstellen for(var c=0; c<files.length; c+=2){ // Neue Spalte in Matrix tmp[count] = []; // Spalte mit den Elementen des File-Arrays füllen for(var r=0; r<rows; r++){ tmp[count][r] = files[c+r]; } count++; } // Über die Matrix iterieren for(var i=0; i<rows; i++){ for(var j=0; j<tmp.length; j++){ if(tmp[j][i]){ insertDiv(wrapper, tmp[j][i]); } } // Zeile umbrechen wrapper.appendChild(document.createElement('br')); } }