Using javascript function to render HTML

Question

I have a static page with login and registration link.I want the user, by clicking on login , to call the Javascript function, which, in turn, displays the Login Form on the same page.

Although I can embed the entire HTML tag in document.write() , it is very dirty and I'm sure this is not the best practice for long HTML codes.

So how can I embed HTML codes in a JS function? and how can I control the positioning of the form on the page.

I am only looking for a Javascript solution, not jQuery

Answer 1

Try making a div containing your elements for registration. So for HTML you can use something like this.

 <div id="regElements" style="display:none;" class="registration" >Elements for a registration form</div> <input type="button" name="re" onclick="showReg()" /> 

And for Javascript, you just use the ths function

 function showReg() { document.getElementById("regElements").style.display = ""; } 

You can find examples of this code everywhere! Good luck

Answer 2

 html = "<form>....</form>"; document.getElementById("example").innerHTML = html; 

Answer 3

Use html tag:

 <iframe id="iframeid" ...> 

JavaScript:

 document.getElementById("iframeid").src="url"; 

http://www.w3schools.com/tags/tag_iframe.asp