jQuery实现页面数据导出成.json文件
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript" src="libs/jquery-1.11.2.js"></script>
<script type="text/javascript" src="libs/jquery.tabletojson.js"></script>
</head>
<body>
<table id="answered">
<thead>
<tr>
<td>姓名</td>
<td>年龄</td>
<td>班级</td>
</tr>
</thead>
<tbody>
<tr>
<td>lili</td>
<td>18</td>
<td>2班</td>
</tr>
</tbody>
</table>
<button>导出json数据</button>
<script type="text/javascript">
$(button).click( function() {
//把表格转化成json数据
var table = $(table).tableToJSON(); // Convert the table into a javascript object
alert(JSON.stringify(table));
console.log(table);
console.log(JSON.stringify(table));
// 下载文件方法
var funDownload = function(content, filename) {
var eleLink = document.createElement(a);
eleLink.download = filename;
eleLink.style.display = none;
// 字符内容转变成blob地址
var blob = new Blob([content]);
eleLink.href = URL.createObjectURL(blob);
// 触发点击
document.body.appendChild(eleLink);
eleLink.click();
// 然后移除
document.body.removeChild(eleLink);
};
if(download in document.createElement(a)) {
funDownload(JSON.stringify(table), testInfo.json);
} else {
alert(浏览器不支持);
}
});
</script>
</body>
</html>
这里用到jQuery的开源插件Table-to-json:
官方地址:
功能说明:将js对象table转换成对象,输出json数据字符串。
