从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

DEMO

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

小提琴