Giả sử, chúng ta có một mảng các mảng lồng nhau như thế này -
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' ];
Chúng tôi được yêu cầu viết một chương trình JavaScript sẽ ánh xạ bất kỳ mảng ký tự nào được lồng vào nhau như vậy với các danh sách HTML không có thứ tự được lồng vào nhau.
Điều duy nhất cần quan tâm ở đây là lồng của ul phải giống hệt với lồng của mảng.
Ví dụ
Mã cho điều này sẽ là -
Mã 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); Mã HTML -
<!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>
Đầu ra
Và đầu ra sẽ là -
