将HTML表格转换为数组[重复]答案

【问题标题】：Convert HTML table to array [duplicate]将HTML表格转换为数组[重复]
【发布时间】：2015-10-30 17:25:54
【问题描述】：

我有一个 html 表格

<table>
<tr>
<th>Type</th>
<th>Text</th>
<th>Time</th>
<th>Notification Time</th>
</tr>
<tr>
<td>Lab1</td>
<td>Some Text</td>
<td>Day of Week</td>
<td>Monday, Wednessday</td>
</tr>
<tr>
<td>Lab2</td>
<td>Some Text</td>
<td>Day of Week</td>
<td>Tuesday, Wednessday</td>
</tr>
</table>

现在我想使用<td> 的这些值并在php 或jquery 中形成一个数组。知道如何以最简单的方式做到这一点吗？

【问题讨论】：

jquery 还是 php？ 2 完全不同的事情......你想用数组做什么
还有：你如何创建那个表？它是来自一个 php 脚本还是一个 jquery 或者...
我正在使用 PHP，需要将这些值保存到数据库中。我已经使用 php 和 jquery 填充了该表。
请显示您是如何填充它的。我猜使用初始数据会更容易。
@ArnabHore，请查看我的高性能 jQuery 解决方案

标签： javascript php jquery html

【解决方案1】：

在 jquery 中：

var tdCollection = $("table").find("td");
var array = [];
$.each(tdCollection, function(key, el){    
     array.push($(el).text());     
});
console.log(array);

小提琴：http://jsfiddle.net/qqdwct7h/

但最好为表设置一个 id 属性，因为使用 $(table) 不是选择某个表的最佳方法。

【讨论】：

保存jsfiddle，然后复制url
与反向循环相比，$.each 的使用非常慢。请检查 jsperf.com ;) 在方法中重复使用 var 也被视为代码异味。
“var 的双重用法”取决于代码风格。
@LazarevAlexandr，好吧，这种编码风格使 JavaScript 文件更重。恭喜:)
好的。 js 文件的重量在投入生产时很重要。到达那里时，js文件应该通过不同的“uglify”过程以使代码不那么“沉重”，而这些事情就在那里受到关注。同时，当一个js文件在开发环境中时，代码风格比它的重量更重要。

【解决方案2】：

检查这个 jQuery 遍历和 Ajax 示例 :)

<script type="text/javascript">
    var tableRows = $("table tr"),
        currentRow,
        tableData = [];

    for (var i = tableRows.length; i--;) {
        currentRow = $(tableRows[i]);

        tableData.push({
            field1: $(":nth-child(1)", currentRow),
            field2: $(":nth-child(2)", currentRow),
            field3: $(":nth-child(3)", currentRow),
            field4: $(":nth-child(4)", currentRow)
        });
    }

    //Sample Test to verify if data is fetched
    console.log(tableData);

    $.ajax({
        url: "sample-ajax-handler.php",
        type: "POST",
        data: tableData,
        success: function (e) {
            //do what you want here :)
        }
    });
</script>

【讨论】：

“field1”索引重复。

【解决方案3】：

我写了一个小提琴，允许基于列生成一个数组：

http://jsfiddle.net/5vfm6k6q/2/

像这样工作：

var parser = new ArrayParser(),
    result = parser.getArray('#table', 'Type');  // table selector, column

【讨论】：