1

ウィキペディア/メディアウィキAPIを使用して、インフォボックス内の最初の画像（ほとんどのウィキペディアページにあるクラス名インフォボックスのテーブル）を抽出したいと思います。

これが私がこれまでに試したことです-

$.getJSON("http://en.wikipedia.org/w/api.php?action=mobileview&format=json&page=mumbai&redirect=no&sections=0&prop=text&sectionprop=toclevel%7Clevel%7Cline%7Cnumber%7Cindex%7Cfromtitle%7Canchor&callback=?", function(json) { 
var wikitext = json.mobileview.sections[0].text;
var img = $(wikitext).find('img:first').attr("src");

/*
//how can i make this work?

//selector for element with multiple classes - http://stackoverflow.com/questions/1041344/jquery-multiple-class-selector
  var infoboximg = $(wikitext).find('table.infobox.geography.vcard img:first').attr("src");
console.log(infoboximg);  
*/

$('#pic').append('<img src="http://' + img + '" />');

}
);

ここでスニペットを試すことができます-http://jsbin.com/erudum/5/

インフォボックスという名前のテーブル内の最初の画像を取得するようにコードを修正するにはどうすればよいですか？

4

1 に答える 1

2

srcのみを取得する必要がありますか？このようにimgを追加してみませんか

$.getJSON("http://en.wikipedia.org/w/api.php?action=mobileview&format=json&page=mumbai&redirect=no&sections=0&prop=text&sectionprop=toclevel%7Clevel%7Cline%7Cnumber%7Cindex%7Cfromtitle%7Canchor&callback=?", function(json) { 
        var wikitext = json.mobileview.sections[0].text;
        var img = $(wikitext).find('img:first');
        $('#pic').append(img);
    }
);

http://jsfiddle.net/wirey00/Kr46e/

編集

戻りテキストを確認した後、実際に返されるのはELEMENTSの配列です。テーブルは5番目の要素であるため、jQueryで.eq（）メソッドを使用して取得できます。

$.getJSON("http://en.wikipedia.org/w/api.php?action=mobileview&format=json&page=mumbai&redirect=no&sections=0&prop=text&sectionprop=toclevel%7Clevel%7Cline%7Cnumber%7Cindex%7Cfromtitle%7Canchor&callback=?", function(json) { 
        var wikitext = json.mobileview.sections[0].text;
        var img = $(wikitext).eq(4).find('img:first').attr('src');
        $('#pic').append('<img src="' + img + '"/>');
    }
);

console.logを実行して、私が何を意味するかを確認できます

console.log($(wikitext));

http://jsfiddle.net/wirey00/Jp7rn/

もう一度編集

なぜそれが配列として戻ってくるのか理解しました。本文中の引用はそれを捨てています。私がすることは、全部を追加することです..多分隠されたフィールドか何かに..それからそれをトラバースしてimgテキストを取得します。その後、もう一度全部を削除します。これが例です

$.getJSON("http://en.wikipedia.org/w/api.php?action=mobileview&format=json&page=mumbai&redirect=no&sections=0&prop=text&sectionprop=toclevel%7Clevel%7Cline%7Cnumber%7Cindex%7Cfromtitle%7Canchor&callback=?", function(json) { 
    var wikitext = json.mobileview.sections[0].text;
    $('#pic').hide().append(wikitext); // hide the div then append whole string
    var img = $('#pic').find('.infobox img:first').attr('src');// find the src
    $('#pic').show().html('<img src="' + img + '"/>'); // show and append
    }
);

http://jsfiddle.net/Jp7rn/1/

于 2012-10-19T19:10:16.547 に答える