AJAX это просто

ajksНу вот и пришло время для первой моей статьи посвященной web программированию. Не знаю почему я выбрал именно эту тему, может потому что мне она достаточно интересна, или показалась простой, но выбор сделан и пора приступать.

Начнем с определения: (взято с википедии):

AJAX (ˈeɪdʒæks, от англ. Asynchronous Javascript and XML — «асинхронный JavaScript и XML») — подход к построению интерактивных пользовательских интерфейсов веб-приложений, заключающийся в «фоновом» обмене данными браузера с веб-сервером. В результате, при обновление данных, веб-страница не перезагружается полностью и веб-приложения становятся более быстрыми и удобными.

Вообще, кто хочет более близко познакомиться с AJAX (его историей и т.п.) то можно перейти по этой ссылке на википедию. Я решил на этом сильно не заострять внимание и перейти ближе к делу.

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

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

AJAX может отправлять запросы двух видов, асинхронные и синхронные. Чем же они отличаются? Ответ очень прост, асинхронные запросы, обрабатываются независимо от остальной части веб страницы, при их использование, JavaScript на странице продолжает полностью функционировать. При синхронных запросах, весь JavaScript на странице останавливается, и ждет пока сервер, пришлет ответ.

Отлично, с видами запросов мы разобрались, теперь перейдем к самому интересному, реализации кода.

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

function getXmlHttp(){
  var xmlhttp;
  try {
       xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
  } catch (e) {
  try {
       xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
  } catch (E) {
       xmlhttp = false;
  }
  }
  if (!xmlhttp && typeof XMLHttpRequest!=undefined) {
  xmlhttp = new XMLHttpRequest();
  }
  return xmlhttp;
}

Вот этой функцией и будет создаваться наш объект для отправки запросов. Теперь давайте разберемся для чего она нужна. Ответ прост, разные браузеры, создают данный объект по разному, и чтобы этот код работал во всех браузерах, мы описали несколько способов создающих данный объект.

Пока на этом хочу закончить статью, продолжение опубликую в ближайшее время, и в нем мы ещё ближе познакомимся с принципами работы AJAX, рассмотрим как реализуются асинхронные и синхронные запросы. Ну а пока все. До скорых встреч.

Закладка Постоянная ссылка.

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *