Hướng dẫn python json2html examples - python json2html ví dụ

json2html

JSON2HTML là một thư viện JavaScript nguồn mở sử dụng các mẫu JS để biến các đối tượng JSON thành HTML.

Xây dựng sét nhanh, các mẫu phía khách hàng tương tác không sử dụng gì ngoài JavaScript.

Miễn phí để sử dụng theo giấy phép MIT.

www.json2html.com cho tài liệu đầy đủ.

Đặc trưng

• Các mẫu JS gốc hoạt động cả máy khách và máy chủ
• Tương tác với các sự kiện nhúng trực tiếp trong các mẫu của bạn
• 100% JavaScript để không cần phải tìm hiểu bất kỳ cú pháp mới nào: Sử dụng các hàm JS nội tuyến cho logic phức tạp

Thí dụ

json2html.render(
    [
        {"name": "Justice League", "year":2021},
        {"name": "Coming 2 America", "year":2021}
    ], 
    {"<>": "li", "html":[
    	{"<>": "span", "text": "${name} (${year})"}
      ]});
    

Sẽ hiển thị HTML sau

<li>
	<span>Justice League (2021)span>
li>
<li>
	<span>Coming 2 America (2021)span>
li

jQuery

Sử dụng một cách vô cùng với jQuery, ồ chúng tôi cũng đã đề cập rằng bạn có thể nhúng các sự kiện vào mẫu của mình? Quên việc đính kèm các sự kiện của bạn sau khi bạn đã hiển thị các mẫu của mình.

 {"<>":"button","text":"Click Me","onclick":(e)=>{
	alert("You just clicked this");
  }};		

Sẽ kết xuất vào HTML sau và sẽ cảnh báo khi nhấp vào :)

<button>Click Mebutton>

Node.js

Sử dụng các nhiệt độ của bạn một cách vô cùng trên Node.js

Cài đặt

npm install node-json2html

Cách sử dụng

	const json2html = require('node-json2html');
        
	let html = json2html.transform([{'male':'Bob','female':'Jane'},{'male':'Rick','female':'Ann'}],{"<>":"div","html":"${male} likes ${female}"});

TypeScript:

  import json2html from 'node-json2html'; //Import module
  const { render, component } = json2html; // Import methods from Json2html

www.json2html.com cho tài liệu đầy đủ.