Javascript AJAX XMLHttpRequest

Question

Я использую Javascript для чтения на сервере, и я хочу фильтровать информацию, предоставленную сервером, чтобы я мог стилизовать его на своей странице. Следующий вызов апи представлен:

http://www.omdbapi.com/?t=pulp+fiction&y=&plot=short&r=json 

И получает эту информацию:

{"Title":"Pulp Fiction","Year":"1994","Rated":"R","Released":"14 Oct 1994", 
"Runtime":"154 min","Genre":"Crime, Drama","Director":"Quentin Tarantino", 
"Writer":"Quentin Tarantino (story), Roger Avary (story), Quentin Tarantino", 
"Actors":"Tim Roth, Laura Lovelace, John Travolta, Samuel L. Jackson",...} 

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

<p id="Title">Movie title!</p> 
<p id="Runtime">Movie runtime!</p> 

. Призыв к api:

xhttp.open("GET", "http://www.omdbapi.com/?t=pulp+fiction&y=&plot=short&r=json"+str, true); 
xhttp.send(); 

Я прочитал много вещей, но не могу заставить его работать так, как я хочу, плохо оцените какую-то помощь! Благодаря

Answer 1

Короткий ответ:

var xhr = new XMLHttpRequest(); 
xhr.onreadystatechange = function() { 
    if (xhr.readyState == XMLHttpRequest.DONE) { 
    // Step 1 below 
    var fullMovie = JSON.parse(xhr.responseText); 
    // Step 2 below 
    var movie = { title: fullMovie.Title, runtime: fullMovie.Runtime }; 
    // Step 3 below 
    document.getElementById('Title').innerText = movie.title; 
    document.getElementById('Runtime').innerText = movie.runtime; 
    } 
} 
xhr.open('GET', 'http://www.omdbapi.com/?t=pulp+fiction&y=&plot=short&r=json', true); 
xhr.send(null); 

Запуск образца: https://jsfiddle.net/mgjyv3q6/1/

Теперь, "длинный ответ", в основном вы должны:

1. Разбираем response или responseText в формате JSON.
2. Создайте новый объект с нужными полями.
3. Извлечь полученную информацию в пользовательском интерфейсе.

Также следует подумать о начале использования jQuery или любой другой библиотеки, которая поможет вам с манипуляциями DOM и запросами AJAX.