Computer >> Hướng Dẫn Máy Tính >  >> Lập Trình >> JavaScript

Tạo danh sách không thứ tự lồng nhau dựa trên mảng lồng nhau trong JavaScript


Giả sử, chúng ta có một mảng lồng nhau các mảng như sau:

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 ta cần viết một chương trình JavaScript ánh xạ bất kỳ mảng lồng nhau nào của các giá trị литерал thành các danh sách không thứ tự (ul) HTML lồng nhau.

Điều cần lưu ý là việc lồng ul phải giống hệt việc lồng của mảng.

Ví dụ

Code cho việc này sẽ là:

Code 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);

Code 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>

Kết quả

Kết quả đầu ra sẽ là:

Tạo danh sách không thứ tự lồng nhau dựa trên mảng lồng nhau trong JavaScript