1

I would like to POST an entire row of a table to a php page (it's part of an Ajax request). If I use JSON.stringify(rowObject) I get an error. I think this is because the object is "cyclical". I really would like to send the row though, because it has ALL the right data, as opposed to posting each variable individually. Is there a simple solutions that doesn't need jquery, or at least doesn't involve messily looping through the object and rebuilding it?

4

4 回答 4

4

JSONML提供了一个很好的标记表示作为 JSON 数据。它还提供了为您转换 DOM 的代码。

鉴于此 DOM：

<table>
    <thead>
        <tr><th>one</th><th>two</th><th>three</th></tr>
    </thead>
    <tbody id="myTbody">
        <tr><td><input value="one"/></td><td><span>two</span></td><td>three</td></tr>
    </tbody>
</table>

此代码将其转换为原生 JavaScript 对象，然后再转换为 JSON：

var result = JsonML.fromHTML(document.querySelector("table"));
var strResult = JSON.stringify(result, null, 4);

并产生这个结果：

http://jsfiddle.net/bF3LK/

[
    "TABLE",
    "\n    ",
    [
        "THEAD",
        "\n        ",
        [
            "TR",
            [
                "TH",
                "one"
            ],
            [
                "TH",
                "two"
            ],
            [
                "TH",
                "three"
            ]
        ],
        "\n    "
    ],
    "\n    ",
    [
        "TBODY",
        {
            "id": "myTbody"
        },
        "\n        ",
        [
            "TR",
            [
                "TD",
                [
                    "INPUT",
                    {
                        "value": "one"
                    }
                ]
            ],
            [
                "TD",
                [
                    "SPAN",
                    "two"
                ]
            ],
            [
                "TD",
                "three"
            ]
        ],
        "\n    "
    ],
    "\n"
]
于 2013-02-24T01:29:07.807 回答
2

鉴于您要获取的行具有 id rowID以下应该按照您的要求进行

JSON.stringify(
    (function(o) {
        var arr=[];
        for(var x=0;x<o.length;x+=1) arr.push(o[x].innerText);
        return arr;
     }) (document.getElementById("rowID").getElementsByTagName("td")));
于 2013-02-24T02:11:52.200 回答
1

我建议迭代 DOM 对象中的元素并动态构建对象。然后你可以安全地 JSON.stringify() 。最好有更多关于 DOM 对象的信息和您想要的 JSON 输出来确定完成此任务的最佳方法。

缺少这些信息，这里有一些建议。

假设 rowObject 是一个 DOM 对象，可能使用 document.getElementById() 或其他一些 DOM 方法获得，您可以访问几个返回字符串值的有用属性。

rowObject.textContent 将为您提供 DOM 对象的纯文本版本，省略 HTML 标记但保留空格。

rowObject.innerText 类似，但应排除不可见的任何内容。

rowObject.innerHTML 将提取内部 HTML 并输出 HTML 标签及其内容。

我知道这与转换为真正的 JSON 不同。同样，最好动态构建一个对象，然后将其传递给 JSON.stringify()。

有关这些属性的更多信息，请参阅：MDN 上的 Node.textContent

于 2013-02-24T01:32:22.080 回答
0

HTML：

<table id="table1">
<tr>
    <td>row 0 cell 0</td>
    <td>row 0 cell 1</td>
    <td>row 0 cell 2</td>
</tr>
<tr>
    <td>row 1 cell 0</td>
    <td>row 1 cell 1</td>
    <td>row 1 cell 2</td>
</tr>
</table>

JS：

var data = [].map.call(table1.rows, function(row){
    return [].map.call(row.cells, function(cell){
        return cell.textContent; 
    });
});
console.log(data);

你会得到这样的数据 json：

[
    [
        "row 0 cell 0",
        "row 0 cell 1",
        "row 0 cell 2"
    ],
    [
        "row 1 cell 0",
        "row 1 cell 1",
        "row 1 cell 2"
    ]
]
于 2015-12-12T10:40:54.413 回答