javascript - 从 HTML 创建数组

Question

我有 4 个图表，每个图表在 html 中都有自己的 div。我试图找到将这些图表自动添加到数组中的最佳方法，而无需在更改图表及其 ID 时更新数组。

HTML：

<table id="dashboard" cellpadding="0" cellspacing="0">
    <tr>
        <td id="c1"><div class='chartLoadingOverlay'>Loading chart please be patient...</div></td>
        <td id="c2"><div class='chartLoadingOverlay'>Loading chart please be patient...</div></td>

    </tr>
    <tr>
        <td id="c3"><div class='chartLoadingOverlay'>Loading chart please be patient...</div></td>
        <td id="c4"><div class='chartLoadingOverlay'>Loading chart please be patient...</div></td>
        <!--<td id="BottomRight"><div class='chartLoadingOverlay'>Loading chart please be patient...</div></td>-->
    </tr>   
</table>

JS：

var arrOfChartContainers = ["c1","c2","c3","c4"];  <-- I want to automate this

Answer 1

演示

var x = $('.chartLoadingOverlay').closest('td').map(function () {
    return this.id;
}).get();
console.log(x);

。地图（）

Answer 2

@Tushar Gupta 有一个很好的答案。这是我的 2 便士，但以防万一。

var arrOfChartContainers = [];
$('table td').each(function() {
    arrOfChartContainers.push(this.id);
});
console.log(arrOfChartContainers);

小提琴