index.htmlを含むファイルで構成されるWebアプリケーションがあります<iframe>。ファイルは、のindex.htmlさまざまなページをロードします<iframe>。これらの各ページには、独自の独立したJavascriptとCSSがあります。
これまでのところすべてが機能しています。
私は今、Ajax呼び出しを使用してこれらのページを<div>.htmlにロードするのではなく、index.htmlのにロードすることを考えてい<iframe>ます。私はいくつかのテストを行いましたが、それは可能ですが、私が心配している問題があります。私はこのテクニックに慣れていないので、ここの専門家が知識を共有できるのではないかと思いました。
問題＃1：
<div>これらのページをファイル内のに直接ロードするindex.htmlと、新しいページはそれ自体と同じDOMにロードされますindex.html。index.htmlしたがって、要素クラスとページのIDの間に競合が発生する可能性があり、たとえばページからホスティングすると、ファイルとページの$("#foo").hide();クラスを持つ要素が実際に非表示になります。ページコードをある種のサンドボックスに入れて、影響を与えないようにする方法はありますか？fooindex.htmlindex.html
問題＃2：
ページを削除するとき（おそらく別のページに置き換えるとき）、そのコードの一部がまだメモリに残っているリスクがあります（ここで説明します）。この影響を防ぐ方法はありますか？もちろん、最初の問題に対する肯定的な答えはこれをカバーします。なぜなら、ページがサンドボックスで実行されている場合、ページをアンロードするとそのjavascriptコードもアンロードされるはずだからです。
問題＃3：
このページは、独自の要素を含む完全なHTML<head>ファイルです<body>。<title>つまり、ホスティングindex.htmlファイルのCCSルールの影響も受けます。これらの負の副作用をどのように防ぐことができますか？
ページ全体をリロードする必要のないページナビゲーションシステムは、多くの最新のWebサイトで一般的なインタラクションメカニズムのようです。これらの副作用なしに（なしで<iframe>）ページを動的にロードするにはどうすればよいですか？