0

私が理解しているように、JQuery load() 関数はドキュメントを取得し、次のことを実行できます。

$('#somecontenttograb').html()

その上で。その方法を知りたいです...本質的に、JQueryを使用してWebページを非同期にダウンロードし、そこから要素を取得して、さまざまな場所にある自分のドキュメントに挿入したいと考えています。

ここでは .ajax 呼び出しが適切であると考えていますが、返されたオブジェクトを理解するのに問題があります。成功関数に渡された引数で要素が引き抜かれる可能性があると思いますが、どのように?

ありがとう、

マット。

以下の2つの回答に投稿されたコードを試してみましたが、これを試してみました.$(result) .find('#content') null のみがアラートに表示されます。最初のアラートの URL をブラウザーに入力すると、有効なページが返されます。何がうまくいかないのですか？

マット。

4

3 に答える 3

2

アップデート

あなたが他の回答に残したコメントに応えて、私は状況を明確に理解していることを確認したいだけです:

  • ローカル ハード ドライブからではなく、ローカル ホストからテストしています (つまり、ブラウザーの URL には " http://localhost " が含まれており、ハード ドライブ上の場所ではありません。
  • AJAX 応答を作成するとalert(...)、結果は null または同等のものになります。
  • URL は有効で、ブラウザにロードできます。
  • リクエストしている URL は、元のページと同じドメイン内にあります。

これらが当てはまる場合は、次のトラブルシューティングを試してみます。

  1. Firefox を使用して Firebug をインストールします (これは、AJAX 要求が失敗しているかどうか、およびその理由を判断するために必要です)
  2. Firebug のコンソールを使用して、コードにログを含めます。
  3. jQuery のajax(...)メソッドを使用し、ログ コードを含めてエラーを処理し、何が起こったかを確認します。表示中のページが失敗したリクエストに対する視覚的な応答を必要とせず、Firebug を使用している場合は、この手順を回避できる場合があります。

これに使用するコードは次のとおりです。

$.ajax({
    url: "http://stackoverflow.com/",
    success: function(html) {
        var responseDoc = $(html);
        // Output the resulting jQuery object to the console
        console.log("Response HTML: ", responseDoc);
    }
    // Handle request failure here
    error: function(){
        console.log("Failure args: ", arguments);
    }
});

Firebug ログの出力を投稿すると、問題の特定と解決策の発見が容易になります。Firebug もログに記録するXMLHttpRequestsので、サーバーとの間で何が送信されているかを正確に確認できます。Firebug は、何らかのサーバー エラーを返した場合、リクエストの外観を変更します (これにより、上記の #3 を回避できます)。 ）。

メソッドを使用することもできますが、次のようにコールバックajax(...)を使用する方が簡単です。get(...)

$.get("http://stackoverflow.com", function(html) {
    var responseDoc = $(html);
});

responseDocから要素を抽出し、他の jQuery オブジェクトと同じように扱うために使用できる jQuery オブジェクトになります。jQuery 操作メソッドを使用して、から内容を抽出し、responseDoc必要に応じてメイン ドキュメントに追加できます。

メソッドが提供する追加機能が必要な場合は$.ajax(...)、次のコードを使用します。

$.ajax({
    url: "http://stackoverflow.com/",
    success: function(html) {
        var responseDoc = $(html);
    }
    error: function(XMLHttpRequest, textStatus, errorThrown){
        // Handle errors here
    }
});
于 2009-11-07T18:55:24.640 に答える
2

問題の Web ページが別のサーバーにある場合、同じオリジン ポリシーの問題により、AJAX を使用して返された html にアクセスすることはできません。別のサーバーから AJAX 経由で取得できる唯一のデータ タイプは JSONP です。これは、スクリプト タグを使用してデータをロードし、javascript コールバックを使用して操作します。別のサイトを処理するもう 1 つの方法は、サーバーにリクエストをプロキシさせることです。つまり、サーバー上のメソッドを呼び出し、それが実際のリクエストを実行します。

同じサーバーにアクセスしている場合は、いくつかの要素を取得するためにページ全体を読み込んで解析するのではなく、ページに挿入する HTML だけを返すようにいくつかのサーバー メソッドを設定することをお勧めします。

于 2009-11-07T19:30:33.960 に答える
0

リクエストしている URL が html を返す場合は、セレクターを使用できます。

$.ajax({
    url: '/test.html',
    success: function(result) {
        // select an element that has id=someElement in the returned html
        var someElement = $(result).find('#someElement');
        // TODO: do something with the element
    }
});
于 2009-11-07T18:57:24.263 に答える