HTML Generation in JS Code

Question

I would like to know your thoughts on generating HTML code in my JS code.

I just think the style is html.push("<tag>" + something + "</tag>")pretty annoying. I already tried something with templates inside my HTML file (and put some placeholders in it), and then used its contents to replace the placeholders with my real values.

But maybe you have other ideas, maybe using jQuery.

Answer 1

jQuery has javascript template plugins like jBind and jTemplate . I have not used them myself, but I recommend jQuery whenever possible.

Note about generating HTML code in most cases is not supported by search engines.

Answer 2

jQuery - . :

// create some HTML
var mySpan = $("<span/>").append("Something").addClass("highlight");

• -,

templating .

Answer 3

createelement, appendchild innerHTML, .

A List Apart, .

Answer 4

, PrototypeJS .

Template , HTML.

var tpl = new Template('Here is a link to <a href="#{link}">#{sitename}</a>');

, .

$('someDiv').innerHTML = tpl.evaluate( {link: 'http://www.stackoverflow.com', sitename: 'StackOverflow'} );

div id = "someDiv", div .

Answer 5

Resig has a small blog post to create a very lightweight template system.

Answer 6

There is a jQuery function that supports this. In particular, you should look at append(content), appendTo(content) prepend(content) prependTo(content), replaceWith(content), after(content), before(content), insertAfter(content)and insertBefore(content).