1

クライアント側で HTML ファイルをインクルードするための軽量な方法を探しています。特に、researchr.org の出版物ページのクライアント側インクルードをサード パーティの Web ページで有効にしたいと考えています。たとえば、次のようなページをエクスポートしたいと思います

http://researchr.org/profile/eelcovisser/publications

(おそらく、そのページの出版物ボックスだけです。)

iframe を使用すると、HTML ページを含めることができます。

<iframe class="foo" style="height: 50em;" width="100%" frameborder="0"
   src="http://researchr.org/profile/eelcovisser/publications">
</iframe>

ただし、iframe には固定の高さを指定する必要がありますが、エクスポートしているページには高さが固定されていません。結果には醜いスクロールバーがあります:

http://swerl.tudelft.nl/bin/view/EelcoVisser/PublicationsResearchr

魅力的と思われるメソッドへの参照を 1 つ見つけました

http://www.webdeveloper.com/forum/archive/index.php/t-26436.html

iframe を使用して html をインポートし、次に、インクルード ドキュメントからインクルード ドキュメントで定義された関数への JavaScript 呼び出しを使用します。これにより、インクルード ファイルの本文の内容がインクルード ファイルの div に配置されます。これは私のシナリオでは機能しません。おそらく、javascript のオリジン ポリシーが同じであるためです。つまり、インクルード ページとインクルード ページが同じドメインからのものではありません (これが要点です)。

これを解決するためのアイデアはありますか？次のいずれかになります。

  • iframe の高さを柔軟にする CSS トリック
  • iframe のコンテンツをインクルード ページの div に持ち上げる JavaScript 手法
  • 私が見落とした他のアプローチ

要件: 含めるコードは最小限にする必要があります。

4

5 に答える 5

2

いいえ。同じ生成元ポリシーにより、そのようなことを (そして正しく) 行うことができなくなります。サーバー側に移動し、サーバー上のスクリプトでそのページにアクセスし、そのコンテンツを自分のページにコピーする必要があります (できればビルド時/バックグラウンドで。アクセス時または AJAX 経由で実行できますが、あなたのサーバーと彼らのサーバーとの間で大量のスクレイピング トラフィックが発生するため、評価されない可能性があります。

または、スクロールバーを我慢するか、iframe を非常に高くします。

于 2009-09-27T20:33:13.890 に答える
0

AJAXを使ってみませんか？

これを試して：

<div id="content"></div>

<script type="text/javascript">

function AJAXObj () {
    var obj = null;
    if (window.XMLHttpRequest) {
        obj = new XMLHttpRequest();
    } else if (window.ActiveXObject) {
        obj = new ActiveXObject("Microsoft.XMLHTTP");
    }
    return obj;
}

var retriever = new AJAXObj();

function getContent(url)
{
    if (retriever != null) {
        retriever.open('GET', url, true);
        retriever.onreadystatechange = function() {
            if (retriever.readyState == 4) {
                document.getElementsById('content').innerHTML(retriever.responseText);
            }
        }
        retriever.send(null);
    }
}

getContent('http://researchr.org/profile/eelcovisser/publications');

</script>

次に、受信したページのコンテンツを正規表現を使用してJSで解析し、そのページから必要なコンテンツを抽出できます。

編集：申し訳ありませんが、それが別のドメインであるという事実を見逃したと思います。しかし、ceejayozが言ったように、そのためにプロキシを使用することができます。

于 2009-09-27T18:59:31.677 に答える
0

私が知っている限り、CSS トリックはありません。唯一の方法は、iFrame の document.documentElement.offsetHeight または scrollHeight を照会することです。どちらが高いかに応じて、その値を取得し、iframe の css の高さに適用します ( + 'px を追加します)。 ')。

于 2009-09-27T18:51:02.733 に答える
0

クロスドメイン機能でこのajax を試してください

于 2009-09-27T18:51:41.787 に答える
0

jQuery を使用している場合は、loadメソッドを使用して AJAX 経由でページを取得し、必要に応じてそのページからコンテンツをスクレイピングし、それを既存の要素に挿入できます。唯一の問題は、JavaScript が必要なことです。

于 2009-09-27T18:53:01.050 に答える