{{textoH2}}

JQuery é uma poderosa ferramenta fácil e divertida de mexer, sem enrolação.

Para utilizar o JQuery Template é bem simples:

1. Adicione o JQuery no head da sua página, exemplo:
<script type="text/javascript" src="https://code.jquery.com/jquery-3.7.1.min.js" integrity="sha256-/JqT3SQfawRcv/BIHPThkBvs0OEvtFFmqPF/lYI/Cxo=" crossorigin="anonymous"></script>

2. Faça o download do JQuery template e adicione o jquery-template.js logo abaixo do jquery-3.7.1.min.js

3. Abaixo esta o código utilizado para renderizar uma tabela como exemplo.

HTML de Exemplo

<table class="table mt-5"> <thead> <tr class="font-weight-bold text-white"> <td>Item</td> <td>Quantidade</td> <td>Valor R$</td> </tr> </thead> <tbody id="itens" class="text-white"> <tr> <td>{{nome}}</td> <td>{{quantidade}}</td> <td>{{valor}}</td> </tr> </tbody> </table>

Javascript de Exemplo

			// Para fazer isto, preciso de dados, então sem enrolação, fiz um json simples 
			// apenas o necessário para demonstrar.
			var itens = [
				{nome:'Teclado', quantidade:2, valor: '200,00'},
				{nome:'Mouse', quantidade:1, valor: '45,00'},
				{nome:'Monitor', quantidade:2, valor: '3.000,00'}
			];

			$.Template.init('#itens');
			$.Template.wait(true);

			itens.forEach(function(row){
				$.Template.element('#itens').build(row);
			});

			$.Template.wait(false);
			$.Template.render();
		

E logo abaixo está a tabela com os dados Renderizados. Para mais detalhes, abra a pasta demo do projeto, la dentro você irá encontrar mais exemplo.

Item	Quantidade	Valor R$
{{nome}}	{{quantidade}}	{{valor}}

Download JQuery Template:

• Demo - Elemento Simples
• Demo - Form Select
• Demo - Table