4

私はjQueryに比較的慣れていないので、この質問が単純すぎる場合はご容赦ください。しかし、何時間にもわたって多数のスレッドを検索したため、明確な解決策を見つけることができません。

私は次のフォルダ構造を持っています：

/index.html

/html/pages/page1.html
/html/pages/images/
/html/pages/css/
/html/pages/js/
/html/pages/includes/

次の基本的な方法で、page1.htmlをindex.htmlのDIVにロードしようとしています。

$('#content').load('html/pages/page1.html', function () {
   console.log('loaded');
});

page1.htmlは正常に読み込まれますが、複数のインクルードで構成され、その中のすべてのコンテンツ（images、CSS、JSなど）はpagesフォルダー（例：../ images / header.jpg）に関連しているためです。すべてが/またはindex.htmlに関連するようになるため、 index.htmlにロードされたときに表示されません。

page1.htmlですべてのパスを絶対パスまたはルート相対にすることで機能し、一種のグローバルパス変数も追加できることをどこかで読みましたが、問題は、レガシーコンテンツが多すぎて、すべてを変更することはできないということです。

パスが相対的であるにもかかわらず、パスを変更せずに上記のようにpage1.htmlをロードする方法はありますか？または、誰かがこの方法で外部コンテンツをロードする効率的な方法（他のプラグイン、テクニック）を推奨できますか？

ありがとうございました！

4

1 に答える 1

4

すべてがフォルダに関連している場合はpages、簡単な検索と置換を使用できます。これは、本来あるべきほど柔軟ではないため（このタイプのコンテキストで相対から絶対に移行することは、適切に機能する多くの要因に依存しているため）、最良のプログラミング手法ではありませんが、機能します。

$.get('html/pages/page1.html', {}, function(data, status, xhr) {
    var updatedData = data.replace(/\.\.\/(images|css|js)+/g, "http://www.mywebsite.com/html/$1");

    $('#content').html(updatedData);
});

編集：

プロキシスクリプトを使用して、このフォルダへのすべてのリクエストをプロキシスクリプトに書き換え/ルーティングすることもできます。使用しているサーバー側のテクノロジーはわかりませんが、次のようにすることができます。

（など）を使用し.htaccessて、このフォルダーに送信されたすべてのリクエストをコードベース内の別のスクリプトにリダイレクトします。スクリプトで、スクリプトに着信するパスを探し、元の出力コンテンツをロードし、検索/置換を実行して、コンテンツをバッファーに出力します。さらに、サーバーでキャッシュを設定して、クライアントがリクエストをキャッシュし、発生する可能性のある処理オーバーヘッドを下げることができます（ただし、かなり最小限になると思います）。

于 2012-12-11T02:38:58.553 に答える