JQuery каждый на API JSON

Question

Я пытаюсь пройтись по API поиска NY Times. Результирующий JSON выглядит так:

{"offset" : "0" , "results" : [{"body" : "NEW ORLEANS — The hemorrhaging well that has spilled millions of gallons of oil into the Gulf of Mexico remained capped for a second day Friday, providing some hope of a long-term solution to the environmental disaster. Live video from the seabed Friday morning showed that all was quiet around the top of the well, suggesting the test" , "byline" : "By CAMPBELL ROBERTSON and HENRY FOUNTAIN" , "date" : "20100717" , "title" : "Oil Spill Capped for a Second Day, Offering Some Hope" , "url" : "http:\/\/www.nytimes.com\/2010\/07\/17\/us\/17spill.html"} , {"body" : "GALVESTON, Tex. — The crayons and paper were out, but not too many children made it to family day at the Ocean Star Offshore Drilling Rig and Museum . Granted, the exhibits of pipelines and seismic vessels may have been over the heads of many grade-schoolers. And despite a few cheerful displays about marine life around rigs and all the bounty" , "byline" : "By MELENA RYZIK" , "date" : "20100716" , "title" : "Texas Remains Stoic as Spill Hits Its Shores" , "url" : "http:\/\/www.nytimes.com\/2010\/07\/16\/us\/16galveston.html"}

(это только два в большем наборе 'результатов')

Вот код, который я использую (с удаленным ключом API)

$.getJSON('http://api.nytimes.com/svc/search/v1/article?format=json&query=oil%2C+bp%2C+gulf+of+mexico&api-key=KEY_REMOVED'+'&callback=?', function(e) {
   $.each(e.results, function() {
      $('#slippery').appendTo(
         '<h2>' + this.title + '</h2>'
      );
   });
});

Мне кажется, это должно сработать, чтобы просмотреть и напечатать все названия историй, но это не так Инструменты разработчика Chrome возвращают две ошибки: «Uncaught SyntaxError: неожиданный токен» и «Ресурс интерпретируется как скрипт, но передается с текстом MIME типа text / plain»

Я все еще работаю над разбором JSON JSON, поэтому я уверен, что делаю что-то простое неправильно. Любая помощь будет высоко ценится.

Answer 1

Я думаю, вы хотите метод append, а не appendTo. AppendTo принимает селектор. Добавить добавляет данные к выбранному в данный момент элементу. Я думаю, что вы хотите добавить вещи в ваш '#slippery' div, а не добавить '#slippery' к чему-либо.

$.getJSON('http://api.nytimes.com/svc/search/v1/article?format=json&query=oil%2C+bp%2C+gulf+of+mexico&api-key=KEY_REMOVED'+'&callback=?', function(e) {
   $.each(e.results, function() {
      $('#slippery').append(
         '<h2>' + this['title'] + '</h2>'
      );
   });
});

Answer 2

Оказалось, что проблема была в синтаксической ошибке, и причина в том, что API NYTimes не возвращает JSONP.Приходится завернуть его вручную.Что является проблемой для другого дня.

Answer 3

Обратный вызов в $. Каждый фактически принимает 2 параметра, indexInArray и valueOfElement, поэтому, когда вы находитесь в замыкании, вам нужно ссылаться на эти параметры следующим образом:

$.getJSON('http://api.nytimes.com/svc/search/v1/article?format=json&query=oil%2C+bp%2C+gulf+of+mexico&api-key=KEY_REMOVED'+'&callback=?', function(e) {
   $.each(e.results, function(indexInArray, valueOfElement) {
      $('#slippery').append(
         '<h2>' + valueOfElement.title + '</h2>'
      );
   });
});

Answer 4

Возможно, вы захотите пропустить, используя функцию $.each(), и просто используйте обычный цикл for. См. item # 6 для объяснения.

* * 1006 В принципе, * * 1007

$.getJSON('http://api.nytimes.com/svc/search/v1/article?format=json&query=oil%2C+bp%2C+gulf+of+mexico&api-key=KEY_REMOVED'+'&callback=?', function(e) {
  $slippery = $('#slippery');
  for ($i = 0, $j = e.results.length; $i < $j; $i++) {
      $slippery.appendTo('<h2>' + e.results[$i].title + '</h2>');
  }
});

будет выполняться быстрее.

Answer 5

Похоже, что вы на самом деле используете jsonp, а не только json.Вам нужно будет изменить свой запрос и вместо этого использовать $.ajax() с dataType: "jsonp" среди прочего.

Из документации API jQ:

JSONP

If the URL includes the string "callback=?" in the URL, the request is treated as JSONP instead. See the discussion of the jsonp data type in $.ajax() for more details.

Answer 6

Попробуйте эту форму:

$(obj).each(function(iteration, value) { /* ... */ });