สมมติว่าเรามีอาร์เรย์ที่ซ้อนกันของอาร์เรย์เช่นนี้ −
const arr = [ 'Value 1', ['Inner value 1', 'Inner value 2', 'Inner value 3', 'Inner value 4'], 'Value 2', 'Value 3', 'Value 4', 'Value 5', 'Value 6' ];
เราจำเป็นต้องเขียนโปรแกรม JavaScript ที่ควรแมปอาร์เรย์ที่ซ้อนกันของตัวอักษรกับรายการ HTML ที่ไม่เรียงลำดับที่ซ้อนกัน
สิ่งเดียวที่ต้องดูแลที่นี่คือการทำรังของ ul จะต้องเหมือนกับการซ้อนของอาร์เรย์
ตัวอย่าง
รหัสสำหรับสิ่งนี้จะเป็น −
โค้ด JavaScript −
const arr = [ 'Value 1', ['Inner value 1', 'Inner value 2', 'Inner value 3', 'Inner value 4'], 'Value 2', 'Value 3', 'Value 4', 'Value 5', 'Value 6' ]; const prepareUL = (root, arr) => { let ul = document.createElement('ul'); let li; root.appendChild(ul); arr.forEach(function(item) { if (Array.isArray(item)) { prepareUL(li, item); return; }; li = document.createElement('li'); li.appendChild(document.createTextNode(item)); ul.appendChild(li); }); } const div = document.getElementById('myList'); prepareUL(div, arr);
HTML Code −
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width"> <title>JS Bin</title> </head> <body> <div id="myList"></div> </body> </html>
ผลลัพธ์
และผลลัพธ์จะเป็น −