0

$ .getを使用してHTMLドキュメントをフェッチしています($ .ajaxも試してみました):

$.get('/products/', function(data) {
    $('.content .article').remove();
    $('.content').prepend($(data).find('.article'));
});

データに問題がないかどうかを確認しました:

alert(data);

そしてそれは問題なくhtmlファイルを印刷します。しかし、私が印刷しようとすると:

alert($(data).find('.article').html());

また

alert($('.article', data).html());

常にnullを出力します。

私はここで同様の問題を見つけました:jQueryでHTMLドキュメントの一部を抽出しますが、解決策は私にはうまくいきませんでした。

編集:コンテンツo生成されたHTML。

<!DOCTYPE html>
<html><head></head><body>

<div class="article"><h1>Lorem Ipsum</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
</div>

</body></html>
4

2 に答える 2

2

さて、内容を入れていただければ本当にいいのですが、data私が得たものから、これらのことをお伝えすることができます...


まず第一に、最後の.contentステートメントの後の一番上の例の引用が欠落しています。

ここを見て:

$('.content').prepend($(data).find('.article'));

次のように修正します。

$('.content').prepend($(data).find('.article'));

次に、実行してconsole.log($(data));、文字列がjQueryオブジェクトに正しく変換されていることを確認します。

別のこととして、多くの要素から実行すると返される可能性がconsole.log($(data).find('.article'));あるため、実行してみて、複数の要素が返されるかどうかを確認してください.html()null

また、複数の要素があり、最初の要素が必要な場合は、次のようにします。

var articles = $(data).find('.article');
var firstArticle = articles.first().html();

または、すべての記事の内部をループしたい場合は、これを実行してそれぞれを取得しますhtml

$.each($(data).find('.article'), function(index, value){
   console.log($(this).html());
});

data何も機能しない場合は、jQueryオブジェクトに変換する前に、文字列としての正確な値を確認してみてください。


解決しました

  • jQueryのページからfromdataを取得する場合、fromコールバックは次のように構成されます。string/products/$.get

ここに画像の説明を入力してください

  • ご覧のとおり、変換data$(data)て検索しようとする.articleと失敗します。これは、オブジェクトが1つの要素だけで構成されているだけではないためです。

  • したがって、コードを次のように変更する必要があります。

    $.get('/products/', function(data){
        $('.content .article').remove();
        $('.content').prepend($(data).eq(1));
    });
    
  • これですべてが機能します。これは、コードがオブジェクトから2番目の要素(記事html-配列インデックスによると1番目の要素)を見つけて、$(data)それを.contentdivに配置するためです。

これがお役に立てば幸いです:-)テストして動作しています。

PS。私が答えを始めたと言ったように、常に要素を印刷することを忘れないでください、console.log($(data));それがどのように構成されているかを知るためにやってみてください!

于 2012-08-10T20:22:44.643 に答える
1

これを試して:

$(data).filter('.article');

これは、データ文字列をjQueryオブジェクトに変換したときに得られるものです。

[div.article, div.nav]

HTMLドキュメント全体を表す文字列を変換する場合、jQueryは本文内のアイテムのみのコレクションを作成するようです。

于 2012-08-12T22:32:59.773 に答える