Уроки PHP, Mootools, JavaScript, ActionScript, HTML, CSS

Если вы каким-то чудом ещё не знаете что такое AJAX то вы пришли по адресу.

Простыми словами можно сформулировать так: AJAX – это когда с помощью JavaScript можно запрашивать и получать данные с сервера не перезагружая станицу сайта.

Основные библиотеки позволяющие использовать технологию AJAX: Prototype и(или) JQuery.

Листинг 1. подключение библиотек prototype, jquery:

<script type="text/javascript" src="prototype.js"></script>
// и(или)
<script type="text/javascript" src="jquery.js"></script>

Jquery – это вообще полезная вещь, так как данная библиотека предлагает разработчику большое количество методов для манипуляции элементами документа и их свойствами и позволяет находить простые и изящные решения для, казалось бы, сложных задач.

Примеры:

//prototype
new Ajax.Request( 'some.php',
{
	method: 'get',
	onSuccess: function( transport ){
		var responseStr = transport.responseText || "Пусто...";
		alert( responseStr );
	},
	onFailure: function(){
		alert( 'Ошибка...' )
	}
});
 
 
//jquery
$.ajax({
  type: "POST",
  url: "some.php",
  data: "name=John&location=Boston",
  success: function(msg){
    alert( "Data Saved: " + msg );
  }
});
 
// или
$.get("test.cgi",
  { name: "John", time: "2pm" },
  function(data){
    alert("Data Loaded: " + data);
  }
);
 
// ну или
$.post("test.cgi",
  { name: "John", time: "2pm" },
  function(data){
    alert("Data Loaded: " + data);
  }
);

Полезнее всего использовать AJAX для улучшения юзабилити в таких приложениях как голосование, корзина, букмарки (..да, много всего) ну и в CMS. Наполнять страницу контентом нужно традиционно, статически, а вот всякий «мусор» типа декора или счётчиков подгружать динамически с применением AJAX.

Изначально сайт нужно разрабатывать без применения AJAX, а потом вкручивать его как дополнение. Посетители не использующие JS смогут без ошибок просматривать сайт, ну и нельзя забывать про индексацию страниц поисковиками. Со всеми своими плюсами AJAX легко может оказать негативное влияние на СЕО.

Ссылочки:

• AJAX Материал из Викиучебника