2

ここではまったく初心者で、条件付きでいくつかの値を html オブジェクトに追加しようとしています。これは私が見つけたサンプルコードから構築されているので、親切に...

$.getJSON('url to facebook json feed', function(fbresults){
    $.each(fbresults.data, function(){
        $('<div></div>')
        .append('<h1>' + this.from.name + '</h1>')
        .append('<p>' + this.story + '</p>')
        $if (typeof this.picture !== "undefined") {
            .append('<img src="' + this.picture + '">')};
        .appendTo('#facebook')
          });
     });
4

4 に答える 4

3

jQuery のappendメソッドは、次のような null オブジェクトを含む複数の要素を受け入れます。

$('<div>').append(
    $('<p>').text('First paragraph'),
    $('<p>').text('Second paragraph'),
    null,
    $('<p>').text('Third paragraph')
);

これはと同等です

$('<div>').append(
    $('<p>').text('First paragraph')
).append(
    $('<p>').text('Second paragraph')
).append(
    null
).append(
    $('<p>').text('Third paragraph')
);

nullオブジェクトは、最終的な DOM 要素では単純に無視されることに注意してください。

このため、次のようにコードを調整できます。

$.getJSON('url to facebook json feed', function(fbresults){
    $.each(fbresults.data, function(){
        $('<div></div>').append(
            $('<h1>').html(this.from.name),
            $('<p>').html(this.story),
            (this.picture) ?
                $('<img>').attr('src', this.picture) :
                null
        ).appendTo('#facebook')
    });
});

に追加される 3 番目の要素は、定義されているかどうかに応じて要素または要素のdivいずれかになります。imgnullthis.picture

于 2016-09-30T20:47:27.087 に答える
2

すべてを連鎖させる必要はありません。

$.getJSON('url to facebook json feed', function(fbresults){
    $.each(fbresults.data, function(){
        var element = $('<div></div>');
        element.append('<h1>' + this.from.name + '</h1>');
        element.append('<p>' + this.story + '</p>');

        if (typeof this.picture !== "undefined") {
            element.append('<img src="' + this.picture + '">')
        };
        element.appendTo('#facebook');
    });
});

また、文字列に追加したいものを作成し、$.each の後に追加することもお勧めです。

于 2013-03-03T23:02:10.330 に答える
1

jQuery は単なる JavaScript ライブラリです。あなたはまだ JavaScript を使っています:

$.getJSON('url to facebook json feed', function(fbresults){
    $.each(fbresults.data, function(){
        var $div = $('<div>');

        $('<h1>', {text: this.from.name}).appendTo($div);
        $('<p>', {text: this.story}).appendTo($div);

        if (this.picture) {
            $('<img>', {src: this.picture}).appendTo($div);
        }

        $div.appendTo('#facebook');
     });
});
于 2013-03-03T22:59:45.557 に答える
0

次のようなことを試してください：

$.getJSON('url to facebook json feed', function(fbresults){
    $.each(fbresults.data, function(){
        var $wrapper = $('<div></div>')
            .append('<h1>' + this.from.name + '</h1>')
            .append('<p>' + this.story + '</p>');

        if (this.picture) {
            $wrapper.append('<img src="' + this.picture + '">');
        } else {
            $wrapper.appendTo('#facebook');
        }
    });
});
于 2013-03-03T23:00:43.797 に答える