简体   繁体   中英

Loading a html page with pure Javascript using AJAX

There is a main page and there are links on that page. When the individual links are clicked, it is supposed to load the contents that link loads inside a div tag of the main page.

Example: MainPage.htm

<html> ... 
    <body> ... 
        <div id="MainContent"> </div> ... 
        <a href='Link1.htm'>Link 1 </a>
    ... 
</html>

Link1.htm

<script src="main.js">...
<div> other contents here </div>

When user clicks on the Link 1, the browser doesn't go to that page, instead AJAX is used to fetch that linked document and load inside #MainContent .

But, the problem is that the linked page has a table and there are table manipulation codes that needed to be run when it first loads. In fact that linked document has link to separate script and some functions that are supposed to run on window.onload .

When I simply load that Linked document using AJAX I am using following approach:

MainContent.innerHTML = XHR.responseText;

This is not helping run the window.onload codes on that linked document.

Are there any solutions or workaround for this type of problem?

Just for side note: I am just Using Javascript no other APIs like angular or jQuery or similar.

Something is wrong with your approach. The main problem here is that the context of the new content that you are getting via ajax is not gonna be executed because the window.onload is already done.

When you refer to "table manipulation codes" I assume that there are a couple of javascript functions that needs to be executed after the content is properly appended in the html, so what you can try over here is moving those "manipulations" to a separate js file and include it in the index.html and execute the proper functions in the success callback after getting the content via ajax.

I think this should be the more accurate approach.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM