Сравнить версии

С чего начать

Revision 273306:

Версия 273306 пользователя Square, сделанная

Revision 273307:

Версия 273307 пользователя Apparition, сделанная

Title:
С чего начать
С чего начать
Slug:
AJAX/С_чего_начать
AJAX/С_чего_начать
Tags:
AJAX
AJAX
Content:

Revision 273306
Revision 273307
n14      Ajax означает Асинхронный JavaScript и XML. В основе технолn14      Ajax означает Асинхронный JavaScript и XML. В основе технол
>огии лежит использование нестандартного объекта XMLHttpRequest(),>огии лежит использование нестандартного объекта <code><a href="ru
> необходимого для взаимодействия со скриптами на стороне сервера.>/XMLHttpRequest">XMLHttpRequest</a></code>, необходимого для взаи
> Объект может как отправлять, так и получать информацию в различн>модействия со скриптами на стороне сервера. Объект может как отпр
>ых форматах включая XML, HTML и даже текстовые файлы. Самое привл>авлять, так и получать информацию в различных форматах включая XM
>екательное в Ajax&nbsp;— это его асинхронный принцип работы. С по>L, HTML и даже текстовые файлы. Самое привлекательное в Ajax&nbsp
>мощью этой технологии можно осуществлять взаимодействие с серверо>;— это его асинхронный принцип работы. С помощью этой технологии 
>м без необходимости перезагрузки страницы. Это позволяет обновлят>можно осуществлять взаимодействие с сервером без необходимости пе
>ь содержимое страницы частично, в зависимости от действий пользов>резагрузки страницы. Это позволяет обновлять содержимое страницы 
>ателя.>частично, в зависимости от действий пользователя.
nn35var httpRequest;
n36    http_request = new XMLHttpRequest();n37    httpRequest = new XMLHttpRequest();
n38    http_request = new ActiveXObject("Microsoft.XMLHTTP");n39    httpRequest = new ActiveXObject("Microsoft.XMLHTTP");
n48http_request = new XMLHttpRequest();n49httpRequest = new XMLHttpRequest();
49http_request.overrideMimeType('text/xml');50httpRequest.overrideMimeType('text/xml');
n55      <code>http_request.onreadystatechange = nameOfTheFunction;<n56      <code>httpRequest.onreadystatechange = nameOfTheFunction;</
>/code>>code>
n61http_request.onreadystatechange = function(){n62httpRequest.onreadystatechange = function(){
n69http_request.open('GET', 'http://www.example.org/some.file', truen70httpRequest.open('GET', 'http://www.example.org/some.file', true)
>);>;
70http_request.send(null);71httpRequest.send(null);
n90http_request.setRequestHeader('Content-Type', 'application/x-www-n91httpRequest.setRequestHeader('Content-Type', 'application/x-www-f
>form-urlencoded');>orm-urlencoded');
n102      <code>http_request.onreadystatechange = nameOfTheFunction;<n103      <code>httpRequest.onreadystatechange = nameOfTheFunction;</
>/code>>code>
n108if (http_request.readyState == 4) {n109if (httpRequest.readyState == 4) {
n136if (http_request.status == 200) {n137if (httpRequest.status == 200) {
n149        <code>http_request.responseText</code> – возвращает ответn150        <code>httpRequest.responseText</code> – возвращает ответ 
> сервера в виде строки текста.>сервера в виде строки текста.
n152        <code>http_request.responseXML</code> – возвращает ответ n153        <code>httpRequest.responseXML</code> – возвращает ответ с
>сервера в виде объекта <code>XMLDocument</code>, который вы может>ервера в виде объекта <code>XMLDocument</code>, который вы можете
>е обходить используя функции JavaScript DOM> обходить используя функции JavaScript DOM
n164        var http_request = false;n165        var httpRequest = false;
n167            http_request = new XMLHttpRequest();n168            httpRequest = new XMLHttpRequest();
168            if (http_request.overrideMimeType) {169            if (httpRequest.overrideMimeType) {
169                http_request.overrideMimeType('text/xml');170                httpRequest.overrideMimeType('text/xml');
n174                http_request = new ActiveXObject("Msxml2.XMLHTTP"n175                httpRequest = new ActiveXObject("Msxml2.XMLHTTP")
>);>;
n177                    http_request = new ActiveXObject("Microsoft.Xn178                    httpRequest = new ActiveXObject("Microsoft.XM
>MLHTTP");>LHTTP");
n182        if (!http_request) {n183        if (!httpRequest) {
n186        http_request.onreadystatechange = function() { alertConten187        httpRequest.onreadystatechange = function() { alertConten
>nts(http_request); };>ts(httpRequest); };
187        http_request.open('GET', url, true);188        httpRequest.open('GET', url, true);
188        http_request.send(null);189        httpRequest.send(null);
n192    function alertContents(http_request) {n193    function alertContents(httpRequest) {
n194        if (http_request.readyState == 4) {n195        if (httpRequest.readyState == 4) {
195            if (http_request.status == 200) {196            if (httpRequest.status == 200) {
196                alert(http_request.responseText);197                alert(httpRequest.responseText);
n229      <b>Замечание</b>: Строка <code>http_request.overrideMimeTypn230      <b>Замечание</b>: Строка <code>httpRequest.overrideMimeType
>e('text/xml');</code> вызовет ошибки в консоли JavaScript в Firef>('text/xml');</code> вызовет ошибки в консоли JavaScript в Firefo
>ox 1.5 или более позднем, как описано в https://bugzilla.mozilla.>x 1.5 или более позднем, как описано в https://bugzilla.mozilla.o
>org/show_bug.cgi?id=311724, если страница вызванная с помощью XML>rg/show_bug.cgi?id=311724, если страница вызванная с помощью XMLH
>HttpRequest не является правильным XML (например, если это обычны>ttpRequest не является правильным XML (например, если это обычный
>й текст). На самом деле это корректное поведение.> текст). На самом деле это корректное поведение.
n235      <b>Замечание 3</b>: Если переменная <code>http_request</codn236      <b>Замечание 3</b>: Если переменная <code>httpRequest</code
>e> используется глобально, то конкурирующие функции, вызывающие <>> используется глобально, то конкурирующие функции, вызывающие <c
>code>makeRequest()</code> могут конкурировать друг с другом, вызы>ode>makeRequest()</code> могут конкурировать друг с другом, вызыв
>вая состязания. Объявление переменной <code>http_request</code> л>ая состязания. Объявление переменной <code>httpRequest</code> лок
>окально в функции и передача ее в <code>alertContent()</code> пре>ально в функции и передача ее в <code>alertContent()</code> предо
>дотвращает состязания.>твращает состязания.
n241http_request.onreadystatechange = alertContents(http_request); //n242httpRequest.onreadystatechange = alertContents(httpRequest); // (
> (не работает)>не работает)
n244      Таким образом, для успешной регистрации функции, вы должны n245      Таким образом, для успешной регистрации функции, вы должны 
>передать ей аргументы косвенно через анонимную функцию или исполь>передать ей аргументы косвенно через анонимную функцию или исполь
>зуя <code>http_request</code> как глобальную переменную. Вот прим>зуя <code>httpRequest</code> как глобальную переменную. Вот приме
>ер:>р:
245    </p>
246    <pre>246    </p>
247    <pre>
247http_request.onreadystatechange = function() { alertContents(http248httpRequest.onreadystatechange = function() { alertContents(httpR
>_request); };  //1 (одновременный запрос)>equest); };  //1 (одновременный запрос)
248http_request.onreadystatechange = alertContents;  //2 (глобальная249httpRequest.onreadystatechange = alertContents;  //2 (глобальная 
> переменная)>переменная)
n251      Первый способ позволяет делать несколько запросов одновремеn252      Первый способ позволяет делать несколько запросов одновреме
>нно, а второй используется, когда переменная <code>http_request</>нно, а второй используется, когда переменная <code>httpRequest</c
>code> является глобальной.>ode> является глобальной.
n257function alertContents(http_request) {n258function alertContents(httpRequest) {
n260            if (http_request.readyState == 4) {n261            if (httpRequest.readyState == 4) {
261                if (http_request.status == 200) {262                if (httpRequest.status == 200) {
262                    alert(http_request.responseText);263                    alert(httpRequest.responseText);
t298      Далее в <code>alertContents()</code> нам нужно заменить стрt299      Далее в <code>alertContents()</code> нам нужно заменить стр
>оку <code>alert(http_request.responseText);</code> на:>оку <code>alert(httpRequest.responseText);</code> на:
299    </p>
300    <pre>300    </p>
301    <pre>
301var xmldoc = http_request.responseXML;302var xmldoc = httpRequest.responseXML;

Вернуться в Историю