我想将一个表的整行发布到一个php页面(它是Ajax请求的一部分)。
如果我使用JSON.stringify(rowObject)
,我会收到错误消息。我认为这是因为该对象是“周期性的”。我真的想发送行,因为它具有所有正确的数据,而不是单独发布每个变量。是否有一个简单的解决方案,不需要jquery,或者至少不涉及乱七八糟地遍历对象并重建它?
答案 0 :(得分:4)
JSONML提供了一个很好的标记表示形式作为JSON数据。它还offers code用于为您转换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);
产生这个结果:
[
"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"
]
答案 1 :(得分: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")));
答案 2 :(得分:1)
我建议迭代DOM对象中的元素并动态构建对象。然后你可以安全地使用JSON.stringify()。最好有关于DOM对象和所需JSON输出的更多信息,以确定实现此目的的最佳方法。
没有这些信息,这里有一些建议。
假设rowObject是一个DOM对象,可能是使用document.getElementById()或其他一些DOM方法获得的,那么您可以访问一些返回字符串值的有用属性。
rowObject.textContent将为您提供DOM对象的纯文本版本,省略HTML标记但保留空格。
rowObject.innerText类似,但应排除任何不可见的内容。
rowObject.innerHTML将提取内部HTML并输出HTML标记及其内容。
我知道这与转换为真正的JSON不同。同样,最好动态构建一个对象,然后将其传递给JSON.stringify()。
有关这些属性的详细信息,请参阅:Node.textContent on MDN
答案 3 :(得分: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"
]
]