json2html：将JSON对象转换为HTML

发表于 由
json2html是一个基于JavaScript的HTML模板库，顾名思义，该库主要用于将JSON对象转换为HTML格式。

使用json2html进行JSON转换，需要先通过JSON来指定转换规则，比如使用转换对象的名称值或属性值作为DOM HTML元素的属性。以下是几个预留的属性名：

  • tag：指定DOM元素的类型（div、span等）
  • html：指定DOM元素需要包含的内容
  • children：指定DOM元素的下一级内容

示例：

  1. var transform = {'tag':'li','html':'${name} (${age})'};   
  2.   
  3. var data = [   
  4.       {'name':'Bob','age':40},   
  5.       {'name':'Frank','age':15},   
  6.       {'name':'Bill','age':65},   
  7.       {'name':'Robert','age':24}   
  8. ];   
  9.   
  10. document.getElementById('list').innerHTML = json2html.transform(data,transform);  

结果如下：

  1. <ul id="list">  
  2.     <li>Bob (40)</li>  
  3.     <li>Frank (15)</li>  
  4.     <li>Bill (65)</li>  
  5.     <li>Robert (24)</li>  
  6. </ul>  

json2html提供了以下两种形式，以便在服务器端和客户端都能使用：

  • jQuery插件形式：扩展了jQuery的核心库，包含了jquery事件
  • node.js包形式：可用于基于node.js的web服务器

项目官网：http://json2html.com/

  1. da shang
    donate-alipay
               donate-weixin weixinpay

发表评论↓↓