Javascript: 2-dimensionales Array erstellen

[Rolf B]

Hallo Linuchs,

arr_playlists ist zunächst mal ein eindimensionales Array von HTML Elementen.

Wenn Du ein zweidimensionales Array willst, musst Du auch eins bauen. Entweder ein neues Array, oder du baust arr_playlists um.

Umbau, zum Beispiel so:

arr_playlists[i] = [ arr_playlists[i], arr_li ];

Das HTML Element in arr_playlists[i] gelangt so nach arr_playlists[i][0] und arr_li nach arr_playlists[i][1].

Man könnte das als schmutzig bezeichnen, weil Du in arr_playlists die Typen änderst. Ich finde das nicht - solange dieser Schmutz auf die Initialisierung beschränkt bleibt.

Schicker ist es, die map-Methode von Arrays aus dem Array-Prototypen herauszuholen und auf die Nodelist anwenden, die getElementsByClassName liefert:

let arr_playlists = Array.prototype.map.call(
   document.getElementsByClassName("playlist"),
   (pl, i) => [ pl, pl.getElementsByTagName("li") ]
);

JavaScript ist so geil - das heutige JS hat mit dem, was es 2000 gab, kaum noch was zu tun 😉

Statt getElementsByClassName oder getElementsByTagName würde ich übrigens konsequent auf querySelectorAll setzen. Browser können CSS Selektoren sehr gut suchen, dafür sind sie optimiert.

let arr_playlists = Array.prototype.map.call(
   document.querySelectorAll(".playlist"),
   (pl, i) => [ pl, pl.querySelectorAll("li") ]
);

Statt [ pl, pl.querySelectorAll("li") ] könnte man noch
[ pl, [... pl.querySelectorAll("li") ] ] schreiben. Das ... ist der Spread-Operator, damit verteilst Du die Elemente eines auflistbaren Objekts in ein Array. Von querySelectorAll bekommst Du eine (statische) NodeList, und Nodelisten sind funktionsärmer als Arrays.

Seit dem Tod des IE kann man damit bedenkenlos arbeiten.

Rolf