利用json2html將json數據填充到html模板

本文轉載自查看原文 2015-10-26 10:45 2314

2、制作好模板、准備好json數據、啟動

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>json2html</title>
<script type="text/javascript" src="json2html.js"></script>
</head>
<body>
<script type="text/javascript">
//html模板格式
var transform = {'tag':'p','html':'${name} (${age})'};
    
//json數據
var data = [
    {'name':'Bob','age':40},
    {'name':'Frank','age':15},
    {'name':'Bill','age':65},
    {'name':'Robert','age':24}
];
//啟動
        document.write(json2html.transform(data,transform));
</script>
</body>
</html>

輸出html代碼：

<p>Bob (40)</p>
<p>Frank (15)</p>
<p>Bill (65)</p>
<p>Robert (24)</p>

免責聲明！

本站轉載的文章為個人學習借鑒使用，本站對版權不負任何法律責任。如果侵犯了您的隱私權益，請聯系本站郵箱yoyou2525@163.com刪除。

猜您在找 json數據映射填充到html元素顯示 Json填充到Form中利用excel模板，將數據填充到excel中根據json數據和HTML模板,渲染嵌套的HTML bootstrap通過ajax請求JSON數據后填充到模態框利用poi將Excel表格中的數據填充到Word模板中 ECharts SSH+JQueryAjax+Json+JSP將數據庫中數據填充到ECharts中 jquery用ajax方式從后台獲取json數據，將內容填充到下拉列表。 jquery用ajax方式從后台獲取json數據后如何將內容填充到下拉列表移動端基於HTML模板和JSON數據的JavaScript交互