On my website I load html, which is rendered at the server (nodejs), and insert it at the right position (most time a div with id content).

How would I insert the received html on the client, so that included script tags are executed?

I am using on the client side underscore and handlebars. But vanillajs is also possible of course.

PS: Here is an example to show the difference between jQuery.html() and setting the innerHTML-property:

/

On my website I load html, which is rendered at the server (nodejs), and insert it at the right position (most time a div with id content).

How would I insert the received html on the client, so that included script tags are executed?

I am using on the client side underscore and handlebars. But vanillajs is also possible of course.

PS: Here is an example to show the difference between jQuery.html() and setting the innerHTML-property:

http://jsfiddle/waxolunist/VDYgU/3/

• javascript
• html
• node.js

Share Improve this question Follow edited May 23, 2013 at 4:51 Christian asked May 6, 2013 at 18:39 ChristianChristian 4,12433 gold badges2929 silver badges4949 bronze badges 4

• You can refer stackoverflow./questions/8825804/… and res.Render in expressjs./api.html#req.xhr – DeveloperBuddy Commented May 6, 2013 at 18:45
• Could you elaborate on this. I don't get it. – Christian Commented May 6, 2013 at 18:52
• You can render html with a callback responding. res.render('sometemplate', {layout: false}); – DeveloperBuddy Commented May 6, 2013 at 19:06
• But isn't res.render a serverside function, or how do I get the response object on the clientside? – Christian Commented May 6, 2013 at 19:35

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 3

with jQuery

$('div#content').html(loaded_html);

without:

getElementById('content').innerHTML = loaded_html;

While possible to do it your way, a better idea might be to send json and render pages in the browser using the same templates you (possibly) use in the server. I'm using doT, which I think to be the best of all JavaScript based templates (like EJS, underscore).

You could leverage jQuery to do that. Just with

$.load("#divname").load(url)

http://api.jquery./load/

There is some problem with your character escaping, please use jshint. Otherwise it is pretty simple to use like

var script1 = "content for jQuery";
var script2 = "content for javascript";

$(document).ready(function (){
    $('#content1').html(script1);
    document.getElementById('content2').innerHTML = script2;
})