Home/ Questions/Q 8631991
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-12T09:17:31+00:00

I have web application which is comprised of an index.html file which includes an

  • 0

I have web application which is comprised of an index.html file which includes an <iframe>. The index.html file loads different pages in the <iframe>. Each of those pages is has its own independent Javascript and CSS.

Everything works so far.

I am now thinking about loading those pages using Ajax calls into a <div>in the index.html instead of loading them into an <iframe>. I have done some tests and it is possible but there is an issue that worries me and since I’m new to this technique I thought maybe some experts here can share knowledge.

Issue #1:

When loading those pages directly to a <div> in the index.html file, the new page loads into the same DOM as the index.html itself. Therefore there can be conflicts between element classes and IDs of the page and hosting index.html for example $("#foo").hide(); from the page will actually hide the elements with class foo in the index.html file as well as the page. Is there any way, I can put the page code in some sort of sandbox preventing it from affecting index.html?

Issue #2:

When removing a page (possibly to replace it with another page), there is a risk part of its code will still stay in the memory (as mentioned here). Is there any way to prevent this effect? Of course a positive answer to the first issue will cover this one
because if the page runs in a sandbox, unloading the page should unload its javascript code as well.

Issue #3:

The page is a complete HTML file with its own <head>, <body> and <title>elements. That means it is going to be affected with the CCS rules from the hosting index.html file as well. How can I prevent these negative side effects?

The paged-navigation system without requiring to reload the whole page seems to be a common interaction mechanism for many modern web sites. How is it possible to load a page dynamically without those side effects (without <iframe>)?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    What you are talking about sounds like a single-page-app. In which case I would recommend going with one of the many existing frameworks that address all the issues you are facing.

    There are several in existence, these are just a couple.

    Knockout.js (knockoutjs.com)

    Ember.js (emberjs.com
    )

    • 0