Appending HTML to end of body using javascript

I have several templates for faceboxes (lightbox) that I need at different points of the application. These are stored in different partials and files.

I will initialize different javascript functions in accordance to which 开发者_运维技巧ones I need. The question is, what is the best way to append the external HTML page into my body using javascript?

Since you tagged the question with it, here's a jQuery solution.

$("body").append("text");

Remember that the parameter can also be a DOM element. So you can do this :

var p = $("<p/>").text("a paragraph");
$("body").append(p);

the easy way with jQuery is:

$('#result').load('test.html');

<div id="result"><!--/ Hold My Data! /--></div>

obviously you can change #result with body

Also you can try some templates library.. Like handlebar and underscore..

and append in the el provided by backbone.js

Suppose you want to append this html in your template, then you can use the below code according to your application Consider the code

Example 1:

rowData += '<div style="width: 130px;">'+param1+'</div>';
rowData += '<div style="width: 130px;">'+param2+'</div>';
$('#ID').html(rowData);

and please make sure that the js should be include in that file. Here is the information of variable used above:

row data - the html that you want to append,

param- if you want to show the value of java script variable on browser dynamically,

#ID- ID of the div in which you want to append this html

example 2: Consider the following HTML:

<h2>Hello World</h2>
<div class="user">
  <div class="inner">Hi</div>
  <div class="inner">Bye</div>
</div>

You can create content and insert it into several elements at once:

$( ".inner" ).append( "<p>Lorem Ipsum</p>" );