将代码片段转换为HTML页面
[英]Turning Code Snippet into an HTML page
问题描述
我有这个非常棒的脚本，它将一个可怕的JSON报告转换为一个Application API端点，该端点由StackExchange的成员（ JSON（从HTML表格）写入到CSV ）。 它在Run Snippet中完美运行，但我想把它放到HTML页面中。
我试过添加一个标题：
<!DOCTYPE html>
<html>
<head>
<title>Convert JSON Report to Table</title>
</head>
<body>
<script type="text/javascript">
并解决了底部的脚本，正文和HTML，但它没有做任何事情。
下面是我想用HTML运行的脚本。 我怎么把它放到一个空白的HTML页面？ 谢谢，马特
var data = {
"Header": {
"Time": "2016-03-30T16:10:19-07:00",
"ReportName": "GeneralLedger",
"ReportBasis": "Accrual",
"StartPeriod": "2016-01-01",
"EndPeriod": "2016-03-31",
"Currency": "GBP",
"Option": [{
"Name": "NoReportData",
"Value": "false"
}]
},
"Columns": {
"Column": [{
"ColTitle": "Date",
"ColType": "tx_date"
}, {
"ColTitle": "Transaction Type",
"ColType": "txn_type"
}, {
"ColTitle": "No.",
"ColType": "doc_num"
}, {
"ColTitle": "Name",
"ColType": "name"
}, {
"ColTitle": "Memo/Description",
"ColType": "memo"
}, {
"ColTitle": "Split",
"ColType": "split_acc"
}, {
"ColTitle": "Amount",
"ColType": "subt_nat_amount"
}, {
"ColTitle": "Balance",
"ColType": "rbal_nat_amount"
}]
},
"Rows": {
"Row": [{
"Header": {
"ColData": [{
"value": "Current",
"id": "144"
}, {
"value": ""
}, {
"value": ""
}, {
"value": ""
}, {
"value": ""
}, {
"value": ""
}, {
"value": ""
}, {
"value": ""
}]
},
"Rows": {
"Row": [{
"ColData": [{
"value": "2016-03-16"
}, {
"value": "Bill Payment (Cheque)",
"id": "181"
}, {
"value": "1"
}, {
"value": "Teddy's T Shirt Supplier",
"id": "70"
}, {
"value": "104478"
}, {
"value": "Creditors",
"id": "138"
}, {
"value": "-600.0"
}, {
"value": "-600.0"
}],
"type": "Data"
}, {
"ColData": [{
"value": "2016-03-17"
}, {
"value": "Bill Payment (Cheque)",
"id": "184"
}, {
"value": "2"
}, {
"value": "Teddy's T Shirt Supplier",
"id": "70"
}, {
"value": "104478"
}, {
"value": "Creditors",
"id": "138"
}, {
"value": "-120.0"
}, {
"value": "-720.0"
}],
"type": "Data"
}, {
"ColData": [{
"value": "2016-03-17"
}, {
"value": "Deposit",
"id": "180"
}, {
"value": ""
}, {
"value": "",
"id": ""
}, {
"value": "Opening Balance"
}, {
"value": "Opening Balance Equity",
"id": "137"
}, {
"value": "2400.0"
}, {
"value": "1680.0"
}],
"type": "Data"
}, {
"ColData": [{
"value": "2016-03-23"
}, {
"value": "Payment",
"id": "186"
}, {
"value": "345678"
}, {
"value": "Maxamillion Enterprises",
"id": "68"
}, {
"value": ""
}, {
"value": "Debtors",
"id": "140"
}, {
"value": "216.0"
}, {
"value": "1896.0"
}],
"type": "Data"
}]
}
}]
}
};
function parse(data) {
var rows = [],
row, curRow, rowSegment;
for (var i = 0; i < data.Rows.Row.length; ++i) {
rowSegment = data.Rows.Row[i].Rows.Row;
for (var j = 0; j < rowSegment.length; ++j) {
row = [];
curRow = rowSegment[j].ColData;
for (var x = 0; x < curRow.length; ++x) {
row.push(curRow[x].value);
}
rows.push(row);
}
}
return rows;
}
var parsed = parse(data);
var rowEl, outEl = document.getElementById('html-out'),
val;
for (var i = 0; i < parsed.length; ++i) {
rowEl = document.createElement("div");
rowEl.setAttribute("class", "row");
rowEl.appendChild(document.createTextNode(parsed[i].join(', ')));
outEl.appendChild(rowEl);
}
1 个解决方案
解决方案1
0 已采纳 2016-04-21 05:43:44
你错过了调用函数解析（ data ）和html-out div元素
var data = { "Header": { "Time": "2016-03-30T16:10:19-07:00", "ReportName": "GeneralLedger", "ReportBasis": "Accrual", "StartPeriod": "2016-01-01", "EndPeriod": "2016-03-31", "Currency": "GBP", "Option": [{ "Name": "NoReportData", "Value": "false" }] }, "Columns": { "Column": [{ "ColTitle": "Date", "ColType": "tx_date" }, { "ColTitle": "Transaction Type", "ColType": "txn_type" }, { "ColTitle": "No.", "ColType": "doc_num" }, { "ColTitle": "Name", "ColType": "name" }, { "ColTitle": "Memo/Description", "ColType": "memo" }, { "ColTitle": "Split", "ColType": "split_acc" }, { "ColTitle": "Amount", "ColType": "subt_nat_amount" }, { "ColTitle": "Balance", "ColType": "rbal_nat_amount" }] }, "Rows": { "Row": [{ "Header": { "ColData": [{ "value": "Current", "id": "144" }, { "value": "" }, { "value": "" }, { "value": "" }, { "value": "" }, { "value": "" }, { "value": "" }, { "value": "" }] }, "Rows": { "Row": [{ "ColData": [{ "value": "2016-03-16" }, { "value": "Bill Payment (Cheque)", "id": "181" }, { "value": "1" }, { "value": "Teddy's T Shirt Supplier", "id": "70" }, { "value": "104478" }, { "value": "Creditors", "id": "138" }, { "value": "-600.0" }, { "value": "-600.0" }], "type": "Data" }, { "ColData": [{ "value": "2016-03-17" }, { "value": "Bill Payment (Cheque)", "id": "184" }, { "value": "2" }, { "value": "Teddy's T Shirt Supplier", "id": "70" }, { "value": "104478" }, { "value": "Creditors", "id": "138" }, { "value": "-120.0" }, { "value": "-720.0" }], "type": "Data" }, { "ColData": [{ "value": "2016-03-17" }, { "value": "Deposit", "id": "180" }, { "value": "" }, { "value": "", "id": "" }, { "value": "Opening Balance" }, { "value": "Opening Balance Equity", "id": "137" }, { "value": "2400.0" }, { "value": "1680.0" }], "type": "Data" }, { "ColData": [{ "value": "2016-03-23" }, { "value": "Payment", "id": "186" }, { "value": "345678" }, { "value": "Maxamillion Enterprises", "id": "68" }, { "value": "" }, { "value": "Debtors", "id": "140" }, { "value": "216.0" }, { "value": "1896.0" }], "type": "Data" }] } }] } }; function parse(data) { var rows = [], row, curRow, rowSegment; for (var i = 0; i < data.Rows.Row.length; ++i) { rowSegment = data.Rows.Row[i].Rows.Row; for (var j = 0; j < rowSegment.length; ++j) { row = []; curRow = rowSegment[j].ColData; for (var x = 0; x < curRow.length; ++x) { row.push(curRow[x].value); } rows.push(row); } } return rows; } var parsed = parse(data); var rowEl, outEl = document.getElementById('html-out'), val; for (var i = 0; i < parsed.length; ++i) { rowEl = document.createElement("div"); rowEl.setAttribute("class", "row"); rowEl.appendChild(document.createTextNode(parsed[i].join(', '))); outEl.appendChild(rowEl); } parse(data);
<div id="html-out"> </div>
在载入HTML页面时，将用于文本动画的JS代码从“单击”变为“自动”？
[英]Turning this JS Code for Text Animation from “on click” to automatic when HTML page loads?
在 html 内容中显示 html 标签，在 html 中显示 html 代码片段
[英]show html tags in html content, show html code snippet in html
如何使用 python 在 HTML 页面（纯文本）上显示 HTML/Javascript 片段？
[英]How to display HTML/Javascript snippet on HTML page (plaintext) using python?
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.