Question

我遇到了JavaScript麻烦。在我的网站上，我有一个表，最后一列是文本字段。

如何在JavaScript中读取表格并将内容保存在数组中。见下表。

<table name="my-ajax-table">
            <thead>                    
                <th>Artikelbezeichnung</th>
                <th>Verkaufspreis</th>
                <th>Bestellmenge</th>
            </thead>
            <tbody>
                <tr id="d1">
                    <td id="drink_name">Cola</td>
                    <td id="drinks_price">6.98</td>
                    <td><input type="text" id="order_amount" value="" name="colaamount"></td>
                </tr>
                <tr id="d2">
                    <td id="drink_name">Fanta</td>
                    <td id="drinks_price">6.98</td>
                    <td><input type="text" id="order_amount" value="" name="order_amount"></td>
                </tr>

            </tbody>
            <br/>
        <br/>
        </table>

Answer 1

我想如果我理解正确的问题，它应该是这样的：

var tds = document.getElementsByTagName('td');
var total_array = [];

for(var i = 0; i < tds.length; i++){
    if(tds[i].className === 'drink_name' || tds[i].className === 'drink_price'){
        total_array.push(tds[i].innerHTML);
    }
}

document.getElementById('test').innerHTML = total_array;

我做了一个名为test的div，它在屏幕上显示了数组，但是当然没有必要这样做。请记住，我也改变了你的HTML（主要是类）。

https://jsfiddle.net/tbLxtmwg/

Answer 2

$(document).ready(function(){
    var arrOftd = [];

    //Iterate all td's 
$('td').each( function(){
   //add item to array
   arrOftd.push( $(this).text() );   
    if($(this).find("input").val() != undefined){
        arrOftd.push($(this).find("input").val()); }
});

//iterate array
$.each( arrOftd, function(i, item){
    console.log(item);
})
});

JS Fiddle

使用JavaScript读取HTML表格

2 个答案: