using JavaScript to insert a lot of html content into a document
I have many many lines of HTML content that I开发者_如何学C need to insert into a document using JavaScript. What the best way to do this? I don't want to have it broken out line by line in the source code, and not all stuffed together in a string.
Have your Javascript code make an AJAX request to the web server for the file that contains the script. When the AJAX request comes back, write the contents of the reply to the InnerHTML
member on the document (or the document child that should contain the text).
This page gives a working example of exactly what you want to do - just replace the CGI with a static file containing the content you want to include.
Best way is not to do that.
Put those in static html files, and link it.
Use can use jquery. Eg:
If you have a div with ID = "Sidebar". To load html content with jquery:
$("#Sidebar").HTML("whatever html content");
http://docs.jquery.com/Attributes/html
You can use jQuery AJAX methods to get the content asynchronously and then use the above method to load it in html.
http://docs.jquery.com/Ajax
You can use an iframe to load the html and use JS to take a part of it in your main page.
This Page (main.html)...
<html>
<head>
<title>Main</title>
</head>
<body>
<iframe id="loader" style="display:none"></iframe>
<div id="target"></div>
<script>
function read(b){
document.getElementById('target').innerHTML = b.innerHTML;
};
var ifr = document.getElementById('loader');
ifr.src = 'testIfrLoad.html#read';
</script>
</body>
</html>
...loads the content of this one (testIfrLoad.html):
<html>
<head>
<title>testIfrLoad</title>
<script>
function send(){
top[window.location.hash.substr(1)](document.body);
}
</script>
</head>
<body onload="send()">
<p>Some content</p>
<p>Some content</p>
<p>Some content</p>
</body>
</html>
精彩评论