JavaScript Отправка Ajax - пример кода ActiveXObject, XMLHttpRequest

Как кроссбраузерно создать объект, через который можно будет выполнять Ajax запросы

Для создания объекта на чистом JavaScript можно использовать такую функцию:

(идея состоит в том, чтобы сначала попробовать создать объекты для IE, а потом уже, если не получится, для остальных браузеров)

/**
 * Создаёт объект для выполнения запроса
 * 
 * @returns {ActiveXObject|XMLHttpRequest|Boolean}
 */
function getXmlHttp(){
	var xmlhttp; // тут будет возвращаемый объект

	// сначала предположим что мы в IE и создадим объект запроса для него

	try { // пробуем создать ActiveXObject типа Msxml2.XMLHTTP
		xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
	} catch (e) { // если не получилось, то
		try { // пробуем создать ActiveXObject типа Microsoft.XMLHTTP
			xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
		} catch (E) { // если не получилось
			xmlhttp = false; // выставляем признак появления исключения
		}
	}
	/* далее если было получено исключение 
	 * и тип XMLHttpRequest известен в текущем браузере -
	 *  создаём уже объект этого типа: */
	if (!xmlhttp && typeof XMLHttpRequest!='undefined') {
		xmlhttp = new XMLHttpRequest();
	}

	return xmlhttp; // возвращаем то, что получилось
}

Как отправлять запросы

Примеры отправки синхронного и асинхронного запроса:



// синхронный запрос - с блокировкой до получения ответа

var xmlhttp = getXmlHttp(); // получаем объект, запроса используя функцию выше

// указываеем метод HTTP - в данном случае GET, адрес и то, что запрос будет синхронным (false)
xmlhttp.open('GET', '/xhr/test.html', false); 
xmlhttp.send(null); // отправляем данные (здесь просто null) - выполняем синхронный запрос

if(xmlhttp.status == 200) { // проверяем статус ответа (успешно ли завершился)
	alert(xmlhttp.responseText); // выводим сообщение с текстом ответа
}



//-----------------------------------

// асинхронный пример (браузер не будет блокировать функционал, во время получения ответа)

var xmlhttp = getXmlHttp(); // получаем объект, запроса используя функцию выше

// указываеем метод HTTP - в данном случае GET, адрес и то, что запрос будет синхронным (false)
xmlhttp.open('GET', '/xhr/test.html', true);
// назначаем функцию, которая запустится после того как ответ придёт
xmlhttp.onreadystatechange = function() { 
   //описываем её реализацию
  if (xmlhttp.readyState == 4) { // проверяем состояние - (пришёл ли?)
     if(xmlhttp.status == 200) { // проверяем статус
       //alert(xmlhttp.responseText); // выводим текст
        console.log('Ответ:', xmlhttp.responseText); // печать ответа сервера в консоль
     }
  }
};

xmlhttp.send(null); // выполняем асинхронный запрос

Источник: см. подробности на xmlhttprequest.ru/