<p>Javascript에 2D 배열이 있습니다. 배열은 'arr' 변수에 할당되며 다음과 같습니다. </p> <pre class="brush:php;toolbar:false;">[ [ "0", { cat_id: "1", cat_name: "호랑이", }, ], [ "1", { cat_id: "2", cat_name: "사자", }, ], [ "2", { cat_id: "3", cat_name: "치타", }, ], [ "삼", { cat_id: "5", cat_name: "표범", }, ], ]</pre> <p>다음과 같이 키를 헤더로, 값을 행으로 사용하여 화면에 깔끔한 HTML 테이블을 사용자에게 제공하고 싶습니다. </p> <테이블 클래스="s-테이블"> <머리> <tr> <번째>cat_id <th>cat_name</th> </tr> </머리> <본문> <tr> <td>1</td> <td>타이거</td> </tr> <tr> <td>2</td> <td>사자</td> </tr> <tr> <td>3</td> <td>치타</td> </tr> <tr> <td>4</td> <td>레오파드</td> </tr> </tbody> </테이블> <p>StackOverflow와 웹에서 많은 기사를 살펴봤지만 저는 Javascript 전문가가 아니고 솔직히 아무것도 작동할 수 없습니다.不常感谢任何帮助！</p> <p>나의 HTML中包含了空表格代码:</p> <p><br /></p> <pre class="snippet-code-js lang-js Prettyprint-override"><code>const arr = [["0", { cat_id: "1", cat_name: "호랑이", },], ["1", { cat_id: "2", cat_name: "사자", },], ["2", { cat_id: "3", cat_name: "치타", },], ["3", { cat_id: "5", cat_name: "표범", },],] var tableBody = document.getElementById("wrap"); tableBody.innerHTML = ""; arr.forEach(함수 (행) { var newRow = document.createElement("tr"); tableBody.appendChild(newRow); if(배열의 행 인스턴스) { row.forEach(함수 (셀) { var newCell = document.createElement("td"); newCell.textContent = 셀; newRow.appendChild(newCell); }); } 또 다른 { newCell = document.createElement("td"); newCell.textContent = 행; newRow.appendChild(newCell); } });</code></pre> <pre class="snippet-code-html lang-html Prettyprint-override"><code><table id="wrap"></table></code></pre> <p><br /></p> <p>因为arr是一个二维数组，所以我的代码目前只会产生以下表格：</p> <pre class="brush:php;toolbar:false;">0 [객체 객체] 1 [객체 객체] 2 [객체 객체] 3 [객체 객체]</pre> <p>我명백<em>为什么</em>会发生这种情况，但我的JS수평불足以实现我想要的结果。</p>