Изменение DOM в обратном вызове getJSON

Question

Изменение DOM в обратном вызове getJSON

0

Я пытаюсь получить некоторые данные из youtube api и показать их на моей веб-странице.

Но по какой-то причине, DOM, который я изменяю внутри обратного вызова getJSON, не изменяется. В консоли, когда я печатаю $ el, я вижу код html в переменной. Но он не отображается на странице или на вкладке источника источника (элементов).

Я не могу добавлять классы, удалять классы или любую операцию DOM внутри него. Мне это интересно, потому что я использовал то же самое в другом месте, и это сработало.

Если после загрузки страницы я делаю то же самое, запустив эту функцию в командной строке, она работает отлично.

Вот код, который я пытаюсь использовать:

get_ytube = function(els){
    var $els = $(els)
    $.each($els, function(i, v) {
        var $v = $(v)
        var id = $v.data("link-id")

        var url = "http://gdata.youtube.com/feeds/api/videos/" + id + "?v=2&alt=jsonc"

        $.getJSON(url, function(json) {
            var $el = $v

            $("<h5 class='title'>" + json.data.title + "</h5>" + 
                "<p class='desc'>" + json.data.description + "</p>").appendTo($el)
            console.log($el[0])
        });
    })
}

AbdealiJK 02 май 2014, в 05:53

Источник

Теги:

javascript

jquery

json

1 ответ

Ещё вопросы

ctown4life · Answer 1 · 2014-05-02T02-01-00.000Z

Может быть, вам просто нужно выполнить его после загрузки окна?

$( document ).ready(function() {
  // put your code here
});

На самом деле, глядя на это, похоже, что вы просто пропускаете кучу точек с запятой, поэтому javascript неправильно интерпретирует ваш код. В этой статье объясняется, почему вы рекомендуете использовать точки с запятой после каждого утверждения в JavaScript? ,

Я добавил их и сам пробовал, и это работает для меня. Взгляните на это http://jsfiddle.net/gx3Us/.

var get_ytube = function(els) {
    var $els = $(els);
    $.each($els, function(i, v) {        
        var $v = $(v);
        var id = $v.data("link-id");
        var url = "http://gdata.youtube.com/feeds/api/videos/" + id + "?v=2&alt=jsonc";
        $.getJSON(url, function(json) {
            var $el = $v;
            $("<h5 class='title'>" + json.data.title + "</h5>" + "<p class='desc'>" + json.data.description + "</p>").appendTo($el);
            console.log($el[0]);
        });
});

}

Я пробовал это с $ (document) .ready () и $ (window) .bind ('load', function () {})