diff --git a/files/ru/_redirects.txt b/files/ru/_redirects.txt index ad6504ef348cc0..3474be8634689f 100644 --- a/files/ru/_redirects.txt +++ b/files/ru/_redirects.txt @@ -4,9 +4,7 @@ # yarn content add-redirect # # FROM-URL TO-URL -/ru/docs/AJAX /ru/docs/Web/Guide/AJAX -/ru/docs/AJAX/С_чего_начать /ru/docs/conflicting/Web/Guide/AJAX -/ru/docs/AJAX:С_чего_начать /ru/docs/conflicting/Web/Guide/AJAX +/ru/docs/AJAX /ru/docs/Learn/JavaScript/Client-side_web_APIs/Fetching_data /ru/docs/Accessibility /ru/docs/Web/Accessibility /ru/docs/Accessibility/Keyboard-navigable_JavaScript_widgets /ru/docs/Web/Accessibility/Keyboard-navigable_JavaScript_widgets /ru/docs/Apps/Progressive /ru/docs/Web/Progressive_web_apps @@ -694,8 +692,7 @@ /ru/docs/Web/Events/transitionend /ru/docs/Web/API/Element/transitionend_event /ru/docs/Web/Events/unhandledrejection /ru/docs/Web/API/Window/unhandledrejection_event /ru/docs/Web/Events/стримится /ru/docs/Web/API/HTMLMediaElement/seeking_event -/ru/docs/Web/Guide/AJAX/Getting_Started /ru/docs/conflicting/Web/Guide/AJAX -/ru/docs/Web/Guide/AJAX/С_чего_начать /ru/docs/conflicting/Web/Guide/AJAX +/ru/docs/Web/Guide/AJAX /ru/docs/Learn/JavaScript/Client-side_web_APIs/Fetching_data /ru/docs/Web/Guide/CSS/Getting_started/SVG_и_CSS /ru/docs/Web/SVG/Tutorial/SVG_and_CSS /ru/docs/Web/Guide/CSS/Understanding_z_index /ru/docs/Web/CSS/CSS_positioned_layout/Understanding_z-index /ru/docs/Web/Guide/CSS/Understanding_z_index/Adding_z-index /ru/docs/Web/CSS/CSS_positioned_layout/Understanding_z-index/Using_z-index diff --git a/files/ru/_wikihistory.json b/files/ru/_wikihistory.json index 84b08b580d3d7c..9b600023d8d6c5 100644 --- a/files/ru/_wikihistory.json +++ b/files/ru/_wikihistory.json @@ -9836,22 +9836,6 @@ "Sheppy" ] }, - "Web/Guide/AJAX": { - "modified": "2020-03-06T17:23:15.361Z", - "contributors": [ - "bulatDev", - "korjjik87", - "chrisdavidmills", - "Sky_Fox", - "Megapotz", - "Kavkazsk", - "Summit677", - "Kwinto", - "Dionys", - "Woodroof", - "Zhuravlik" - ] - }, "Web/Guide/API": { "modified": "2019-09-11T09:35:03.457Z", "contributors": ["SphinxKnight", "BychekRU", "Sheppy"] @@ -16434,17 +16418,6 @@ "modified": "2019-03-24T00:00:53.915Z", "contributors": ["Dionys"] }, - "conflicting/Web/Guide/AJAX": { - "modified": "2019-03-24T00:01:49.926Z", - "contributors": [ - "DanilaH", - "chrisdavidmills", - "Megapotz", - "Apparition", - "Square", - "Kwinto" - ] - }, "conflicting/Web/Guide/Mobile": { "modified": "2019-03-23T23:27:06.077Z", "contributors": ["wbamberg"] @@ -17303,10 +17276,6 @@ "modified": "2020-11-18T14:46:25.201Z", "contributors": ["chrisdavidmills", "YozhEzhi", "arcady-zherdev"] }, - "orphaned/Web/Guide/AJAX/С_чего_начать?": { - "modified": "2019-01-16T16:10:29.921Z", - "contributors": ["chrisdavidmills", "Sheppy", "Nikol"] - }, "orphaned/Web/Guide/Events": { "modified": "2020-08-20T10:40:53.452Z", "contributors": ["bogpok", "Llorephie", "Tihoem", "Jeremie"] diff --git a/files/ru/conflicting/web/api/document/domcontentloaded_event/index.md b/files/ru/conflicting/web/api/document/domcontentloaded_event/index.md index b7568da147b654..a48136ba78c827 100644 --- a/files/ru/conflicting/web/api/document/domcontentloaded_event/index.md +++ b/files/ru/conflicting/web/api/document/domcontentloaded_event/index.md @@ -12,7 +12,7 @@ original_slug: Web/API/Window/DOMContentLoaded_event ## Ускорение работы -Если вы хотите чтобы DOM был пройден парсером насколько возможно быстро, сразу после запроса пользователем страницы, вы можете попробовать выполнять [JavaScript асинхронно](/ru/docs/Web/API/XMLHttpRequest/Synchronous_and_Asynchronous_Requests) и [оптимизировать загрузку таблиц стилей](https://developers.google.com/speed/docs/insights/OptimizeCSSDelivery) которые обычно замедляют загрузку документа поскольку загружаясь одновременно "крадут" трафик у основного документа. +Если вы хотите чтобы DOM был пройден парсером насколько возможно быстро, сразу после запроса пользователем страницы, вы можете попробовать выполнять [JavaScript асинхронно](/ru/docs/Web/API/XMLHttpRequest_API/Synchronous_and_Asynchronous_Requests) и [оптимизировать загрузку таблиц стилей](https://developers.google.com/speed/docs/insights/OptimizeCSSDelivery) которые обычно замедляют загрузку документа поскольку загружаясь одновременно "крадут" трафик у основного документа. ## Основная информация diff --git a/files/ru/conflicting/web/guide/ajax/index.md b/files/ru/conflicting/web/guide/ajax/index.md deleted file mode 100644 index d61203f1b338fd..00000000000000 --- a/files/ru/conflicting/web/guide/ajax/index.md +++ /dev/null @@ -1,254 +0,0 @@ ---- -title: С чего начать -slug: conflicting/Web/Guide/AJAX -original_slug: Web/Guide/AJAX/Getting_Started ---- - -В этой статье рассмотрены основные принципы работы AJAX и даны два простых примера, использующих эту технологию. - -### Что такое AJAX? - -Ajax означает Асинхронный JavaScript и XML. В основе технологии лежит использование нестандартного объекта [`XMLHttpRequest`](/ru/XMLHttpRequest), необходимого для взаимодействия со скриптами на стороне сервера. Объект может как отправлять, так и получать информацию в различных форматах включая XML, HTML и даже текстовые файлы. Самое привлекательное в Ajax — это его асинхронный принцип работы. С помощью этой технологии можно осуществлять взаимодействие с сервером без необходимости перезагрузки страницы. Это позволяет обновлять содержимое страницы частично, в зависимости от действий пользователя. - -Две особенности, которые мы рассмотрим: - -- Отправление запросов серверу без перезагрузки страницы -- Работа с XML документами - -### Шаг 1 — Как послать HTTP запрос - -Для того, чтобы послать HTTP запрос на сервер используя JavaScript, вам необходим экземпляр класса, который позволит это сделать. Такой класс впервые был введён в Internet Explorer как объект ActiveX, называемый `XMLHTTP`. Позже в Mozilla, Safari и другие браузеры был введён класс `XMLHttpRequest`, который поддерживал методы и свойства изначального объекта ActiveX от Microsoft. - -В результате, чтобы создать кросс-браузерный объект требуемого класса, вы можете сделать следующее: - -``` -var httpRequest; -if (window.XMLHttpRequest) { // Mozilla, Safari, ... - httpRequest = new XMLHttpRequest(); -} else if (window.ActiveXObject) { // IE - httpRequest = new ActiveXObject("Microsoft.XMLHTTP"); -} -``` - -(В целях наглядности, код выше является немного упрощённым. Более жизненный пример будет рассмотрен в шаге 3 этой статьи) - -Некоторые версии некоторых броузеров Mozilla не будут корректно работать, если ответ сервера не содержит заголовка XML `mime-type`. Чтобы решить эту проблему, вы можете использовать вызовы дополнительных методов для переопределения заголовка полученного от сервера, если он отличен от `text/xml`. - -``` -httpRequest = new XMLHttpRequest(); -httpRequest.overrideMimeType('text/xml'); -``` - -Далее вам необходимо решить, что вы будете делать после получения ответа сервера. На этом этапе вам необходимо указать объекту, какая JavaScript функция будет обрабатывать ответ. Это делается путём присваивания свойству `onreadystatechange` имени JavaScript функции, которую вы собираетесь использовать: - -`httpRequest.onreadystatechange = nameOfTheFunction;` - -Заметьте, что после названия функции нет скобок и не указано параметров, потому что вы просто присваиваете ссылку на функцию, а не вызываете её. К тому же, вместо указания имени функции, вы можете использовать возможность JavaScript объявлять функции на лету (так называемые «анонимные функции») и указывать действия, которые тотчас же будут обрабатывать ответ: - -``` -httpRequest.onreadystatechange = function(){ - // какой-нибудь код -}; -``` - -Далее, после того как вы объявили что будет происходить после получения ответа, вам необходимо сделать запрос. Вы должны вызвать методы класса `open()` и `send()`: - -``` -httpRequest.open('GET', 'http://www.example.org/some.file', true); -httpRequest.send(null); -``` - -- Первый параметр вызова функции `open()` — метод HTTP запроса (GET, POST, HEAD или любой другой метод, который вы хотите использовать). Используйте методы в соответствии с HTTP стандартами, иначе некоторые браузеры (такие как Firefox) могут не обработать запрос. Информация о допустимых HTTP запросах доступна по адресу [спецификации W3C](http://www.w3.org/Protocols/rfc2616/rfc2616-sec9.html) -- Второй параметр — URL запрашиваемой страницы. Из соображений безопасности возможность запрашивать страницы сторонних доменов недоступна. Убедитесь, что вы используете одинаковое доменное имя на всех страницах, иначе вы получите ошибку 'доступ запрещён' при вызове функции `open()`. Типичной ошибкой при доступе к сайту через `site.ru` является отправка запроса на `www.site.ru`. -- Третий параметр указывает, является ли запрос асинхронным. Если он `TRUE`, то выполнение JavaScript продолжится во время ожидания ответа сервера. В этом и заключается асинхронность технологии. - -Параметром метода `send()` могут быть любые данные, которые вы хотите послать на сервер. Данные должны быть сформированы в строку запроса: - -`name=value&anothername=othervalue&so=on` - -Заметьте, что если вы хотите отправить данные методом `POST`, вы должны изменить MIME-тип запроса с помощью следующей строки: - -``` -httpRequest.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded'); -``` - -Иначе сервер проигнорирует данные отправленные методом POST. - -### Шаг 2 — Обрабатываем ответ сервера - -Отправляя запрос, вы указали имя функции JavaScript, обрабатывающей ответ. - -`httpRequest.onreadystatechange = nameOfTheFunction;` - -Давайте посмотрим, что эта функция должна делать. Во-первых, функция должна проверять статус запроса. Если значение переменной статуса 4, то это означает, что ответ от сервера получен и его можно обрабатывать. - -``` -if (httpRequest.readyState == 4) { - // все в порядке, ответ получен -} else { - // все ещё не готово -} -``` - -Полный список значений кодов `readyState` такой: - -- 0 (uninitialized) -- 1 (loading) -- 2 (loaded) -- 3 (interactive) -- 4 (complete) - -([Источник](http://msdn.microsoft.com/workshop/author/dhtml/reference/properties/readystate_1.asp)) - -Следующее, что нужно проверить — это статус HTTP-ответа. Все возможные коды можно посмотреть на [сайте W3C](http://www.w3.org/Protocols/rfc2616/rfc2616-sec10.html). Для наших целей нам интересен только код ответа `200 OK`. - -``` -if (httpRequest.status == 200) { - // великолепно! -} else { - // с запросом возникли проблемы, - // например, ответ может быть 404 (Не найдено) - // или 500 (Внутренняя ошибка сервера) -} -``` - -Теперь, после проверки состояния запроса и статуса HTTP-ответа, вы можете делать с данными, полученными от сервера, всё что угодно. Есть два способа получить доступ к данным: - -- `httpRequest.responseText` – возвращает ответ сервера в виде строки текста. -- `httpRequest.responseXML` – возвращает ответ сервера в виде объекта `XMLDocument`, который вы можете обходить используя функции JavaScript DOM - -### Шаг 3 — Простой пример - -Давайте соберём все вместе и сделаем простой пример HTTP-запроса. Наш JavaScript запросит HTML документ `test.html`, который содержит текст "I'm a test." и выведет содержимое файла в диалоговом окне. - -``` - - - Сделать запрос - -``` - -В этом примере: - -- Пользователь нажимает на ссылку "Сделать запрос" в броузере; -- Это вызывает функцию `makeRequest()` с параметром `test.html` — именем HTML файла; -- Посылается запрос, после чего (`onreadystatechange`) выполнение передаётся `alertContents()`; -- `alertContents()` проверяет получен ли ответ и все ли с ним в порядке, после чего содержимое файла `test.html` выводится в диалоговом окне. - -**Замечание**: Строка `httpRequest.overrideMimeType('text/xml');` вызовет ошибки в консоли JavaScript в Firefox 1.5 или более позднем, как описано в , если страница вызванная с помощью XMLHttpRequest не является правильным XML (например, если это обычный текст). На самом деле это корректное поведение. - -**Замечание 2**: Если вы посылаете запрос не на статический XML-файл, а на серверный скрипт, возвращающий XML, то нужно установить некоторые заголовки ответа, если вы планируете сделать вашу страницу работоспособной в Internet Explorer помимо Mozilla. Если вы не установите заголовок `Content-Type: application/xml`, IE будет сообщать об ошибке JavaScript, 'Object Expected', после строки, где вы пытаетесь получить доступ к XML элементу. Если вы не установите заголовок `Cache-Control: no-cache` броузер будет кешировать ответ и никогда не будет повторно отправлять запрос, что сделает отладку весьма «забавной». - -**Замечание 3**: Если переменная `httpRequest` используется глобально, то конкурирующие функции, вызывающие `makeRequest()` могут конкурировать друг с другом, вызывая состязания. Объявление переменной `httpRequest` локально в функции и передача её в `alertContent()` предотвращает состязания. - -**Замечание 4**: При привязывании колбэк-функции к `onreadystatechange` нельзя указать аргументы. По этой причине не работает следующий код: - -``` -httpRequest.onreadystatechange = alertContents(httpRequest); // (не работает) -``` - -Таким образом, для успешной регистрации функции, вы должны передать ей аргументы косвенно через анонимную функцию или используя `httpRequest` как глобальную переменную. Вот пример: - -``` -httpRequest.onreadystatechange = function() { alertContents(httpRequest); }; //1 (одновременный запрос) -httpRequest.onreadystatechange = alertContents; //2 (глобальная переменная) -``` - -Первый способ позволяет делать несколько запросов одновременно, а второй используется, когда переменная `httpRequest` является глобальной. - -**Замечание 5**: В случае ошибки взаимодействия (например, если сервер упал), при попытке доступа к переменной .status метода onreadystatechange будет сгенерировано исключение. Убедитесь, что if...then заключено в try...catch. (См. ). - -``` -function alertContents(httpRequest) { - - try { - if (httpRequest.readyState == 4) { - if (httpRequest.status == 200) { - alert(httpRequest.responseText); - } else { - alert('С запросом возникла проблема.'); - } - } - } - catch( e ) { - alert('Произошло исключение: ' + e.description); - } - - } -``` - -### Шаг 4 — Работа с XML ответом - -В предыдущем примере, после того как был получен ответ на HTTP-запрос мы использовали `responseText` запрашиваемого объекта, который содержал данные файла `test.html`. Теперь давайте попробуем использовать свойство `responseXML`. - -Прежде всего, давайте создадим правильный XML документ, который мы будем запрашивать. Документ (`test.xml`) содержит следующее: - -``` - - - I'm a test. - -``` - -В скрипте нам всего лишь необходимо заменить строку запроса на: - -``` -... -onclick="makeRequest('test.xml')"> -... -``` - -Далее в `alertContents()` нам нужно заменить строку `alert(httpRequest.responseText);` на: - -``` -var xmldoc = httpRequest.responseXML; -var root_node = xmldoc.getElementsByTagName('root').item(0); -alert(root_node.firstChild.data); -``` - -Этот код берёт объект `XMLDocument`, возвращаемый `responseXML` и использует методы DOM для доступа к данным, содержащимся в документе XML. - -Чтобы узнать больше о методах DOM, посмотрите [реализация DOM в Mozilla](http://www.mozilla.org/docs/dom/). diff --git a/files/ru/glossary/ajax/index.md b/files/ru/glossary/ajax/index.md index 999d4690921030..867c01fee74126 100644 --- a/files/ru/glossary/ajax/index.md +++ b/files/ru/glossary/ajax/index.md @@ -1,23 +1,24 @@ --- title: AJAX slug: Glossary/AJAX +l10n: + sourceCommit: c215109b90da51435eaa2c94a8f6764909f628e0 --- {{GlossarySidebar}} -**Ajax**, который изначально означал «Асинхронный {{Glossary("JavaScript")}} и {{Glossary("XML")}}», — это практика программирования для создания сложных, динамических веб-страниц с использованием технологии {{Glossary("XHR_(XMLHttpRequest)","XMLHttpRequest")}}. +Асинхронный JavaScript и XML (**Ajax** или **AJAX**) — это подход к разработке, при котором веб-приложения запрашивают данные с сервера с помощью асинхронных HTTP-запросов и обновляют только необходимые части документа, без полной перезагрузки страницы. Это может сделать страницу более отзывчивой, потому что запрашиваются только необходимые для обновления части. -Ajax позволяет обновлять части {{Glossary("DOM")}} {{Glossary("HTML")}}-страницы без перезагрузки всей страницы целиком. Ajax также позволяет вам работать асинхронно, что означает, что ваш код продолжает работать, пока обновляемая часть веб-страницы пытается перезагрузиться (по сравнению с синхронным подходом, в котором код блокируется до тех пор, пока часть веб-страницы не будет перезагружена полностью). +Ajax можно использовать для создания {{Glossary("SPA", "одностраничных приложений")}}, которые состоят из одного документа, использующего Ajax для обновления содержимого. -Благодаря интерактивным веб-сайтам и современным веб-стандартам, Ajax постепенно заменяется функциями, определёнными в JavaScript-фреймворках, и официальным стандартом {{domxref("Fetch API")}}. +Изначально для реализации Ajax использовался интерфейс {{DOMxRef("XMLHttpRequest")}}, но на данный момент для создания современных веб-приложений больше подходит {{DOMxRef("fetch()")}} API: он более мощный, гибкий и лучше интегрируется с фундаментальными веб-технологиями, такими как [Service Worker API](/ru/docs/Web/API/Service_Worker_API). Современные веб-фреймворки также предоставляют абстракции для использования Ajax. -- [Глоссарий](/ru/docs/Glossary): +Эта техника настолько широко распространена в современной веб-разработке, что сам термин «Ajax» сейчас используется редко. - - {{Glossary("XHR_(XMLHttpRequest)","XMLHttpRequest")}} +## Смотрите также -- [Ajax](/ru/docs/Web/Guide/AJAX) -- [Ajax - начало работы](/ru/docs/Web/Guide/AJAX/Getting_Started) -- {{DOMxRef("XMLHttpRequest")}} +- [Получение данных с сервера](/ru/docs/Learn/JavaScript/Client-side_web_APIs/Fetching_data) - {{DOMxRef("Fetch API")}} -- [Использование Fetch API](/ru/docs/Web/API/Fetch_API/Using_Fetch) -- [Синхронное vs. Асинхронное взаимодействие](http://peoplesofttutorial.com/difference-between-synchronous-and-asynchronous-messaging/) +- {{Glossary("SPA", "Single-page application")}} +- {{DOMxRef("XMLHttpRequest")}} +- [AJAX](https://en.wikipedia.org/wiki/AJAX) на Википедии diff --git a/files/ru/glossary/asynchronous/index.md b/files/ru/glossary/asynchronous/index.md index 99c825f21314a8..5eb029908c7922 100644 --- a/files/ru/glossary/asynchronous/index.md +++ b/files/ru/glossary/asynchronous/index.md @@ -5,15 +5,9 @@ slug: Glossary/Asynchronous {{GlossarySidebar}} -_Асинхронный_ относится к среде связи, где каждый участник получает и обрабатывает сообщение, когда это удобно, или возможно, а не сразу. - -Это можно использовать для описания такой среды связи, как e-mail — отправитель отправляет сообщение, а получатель ответ на него, когда ему будет удобно; они не должны отвечать немедленно. - -Это также можно использовать, для описания программной среды связи, например, [AJAX](/ru/docs/Web/Guide/AJAX) это асинхронный механизм для запроса небольшого объёма данных через протокол [HTTP](/ru/docs/Web/HTTP); результат отправляется обратно, когда ответ будет сформирован, а не сразу. +Термин _асинхронный_ относится к двум или более объектам или событиям, которые не существуют или не происходят одновременно, то есть они **не являются** {{glossary("synchronous", "синхронными")}}. Когда происходит несколько связанных событий, не зависящих от завершения предыдущих, они асинхронны. ## Смотрите также -### Техническая справка - -- [Получение данных с сервера](/ru/docs/Learn/JavaScript/Client-side_web_APIs/Fetching_data) (Learning Area) -- {{glossary("Synchronous","Синхронный")}} +- [Получение данных с сервера](/ru/docs/Learn/JavaScript/Client-side_web_APIs/Fetching_data) +- {{glossary("Synchronous", "Синхронный")}} diff --git a/files/ru/glossary/synchronous/index.md b/files/ru/glossary/synchronous/index.md index 29172573a78084..6e8118655aade6 100644 --- a/files/ru/glossary/synchronous/index.md +++ b/files/ru/glossary/synchronous/index.md @@ -16,4 +16,4 @@ _Синхронный_ относится к среде связи где каж ### Техническая документация - {{glossary("Asynchronous")}} -- [Синхронные и асинхронные запросы](/ru/docs/Web/API/XMLHttpRequest/Synchronous_and_Asynchronous_Requests) с использованием [XMLHttpRequest()](/ru/docs/Web/API/XMLHttpRequest) {{glossary("API")}} +- [Синхронные и асинхронные запросы](/ru/docs/Web/API/XMLHttpRequest_API/Synchronous_and_Asynchronous_Requests) с использованием [XMLHttpRequest()](/ru/docs/Web/API/XMLHttpRequest) {{glossary("API")}} diff --git a/files/ru/glossary/xmlhttprequest/index.md b/files/ru/glossary/xmlhttprequest/index.md index fc4b484dc0c60b..89497ebae6299e 100644 --- a/files/ru/glossary/xmlhttprequest/index.md +++ b/files/ru/glossary/xmlhttprequest/index.md @@ -17,4 +17,4 @@ slug: Glossary/XMLHttpRequest ### Техническая информация - Объект {{domxref("XMLHttpRequest")}} -- [документация MDN о том, как использовать XMLHttpRequest](/ru/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest) +- [документация MDN о том, как использовать XMLHttpRequest](/ru/docs/Web/API/XMLHttpRequest_API/Using_XMLHttpRequest) diff --git a/files/ru/learn/javascript/objects/json/index.md b/files/ru/learn/javascript/objects/json/index.md index 572fabd1206aa2..33537e1adbde0e 100644 --- a/files/ru/learn/javascript/objects/json/index.md +++ b/files/ru/learn/javascript/objects/json/index.md @@ -319,7 +319,7 @@ myString; - [JSON object reference page](/ru/docs/Web/JavaScript/Reference/Global_Objects/JSON) - [XMLHttpRequest object reference page](/ru/docs/Web/API/XMLHttpRequest) -- [Using XMLHttpRequest](/ru/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest) +- [Using XMLHttpRequest](/ru/docs/Web/API/XMLHttpRequest_API/Using_XMLHttpRequest) - [HTTP request methods](/ru/docs/Web/HTTP/Methods) - [Official JSON web site with link to ECMA standard](http://json.org) diff --git a/files/ru/web/api/document/domcontentloaded_event/index.md b/files/ru/web/api/document/domcontentloaded_event/index.md index 4aadd129ad0b83..7ad8d40144197d 100644 --- a/files/ru/web/api/document/domcontentloaded_event/index.md +++ b/files/ru/web/api/document/domcontentloaded_event/index.md @@ -32,7 +32,7 @@ slug: Web/API/Document/DOMContentLoaded_event Разные события,[`load`](/ru/docs/Web/API/Window/load_event), должны быть использованы только для обнаружения полностью загруженной страницы. Это распространённая ошибка в использовании `load`, там где `DOMContentLoaded` было бы более уместным. -Синхронный JavaScript останавливает разбор DOM. Если вы хотите что бы DOM был разобран как можно быстрее после того как пользователь запросит страницу, вы должны сделать ваш [JavaScript асинхронным](/ru/docs/Web/API/XMLHttpRequest/Synchronous_and_Asynchronous_Requests) and [оптимизировать загрузку таблиц стилей](https://developers.google.com/speed/docs/insights/OptimizeCSSDelivery). Если загружать как обычно, таблицы стилей тормозят разбор DOM так как они загружаются параллельно, "крадя" трафик у основного HTML документа. +Синхронный JavaScript останавливает разбор DOM. Если вы хотите что бы DOM был разобран как можно быстрее после того как пользователь запросит страницу, вы должны сделать ваш [JavaScript асинхронным](/ru/docs/Web/API/XMLHttpRequest_API/Synchronous_and_Asynchronous_Requests) and [оптимизировать загрузку таблиц стилей](https://developers.google.com/speed/docs/insights/OptimizeCSSDelivery). Если загружать как обычно, таблицы стилей тормозят разбор DOM так как они загружаются параллельно, "крадя" трафик у основного HTML документа. ## Примеры diff --git a/files/ru/web/api/xmlhttprequest/abort/index.md b/files/ru/web/api/xmlhttprequest/abort/index.md index 75e9146aedaa70..8ca89baf238913 100644 --- a/files/ru/web/api/xmlhttprequest/abort/index.md +++ b/files/ru/web/api/xmlhttprequest/abort/index.md @@ -44,4 +44,4 @@ xhr.abort(); ## Смотрите также -- [Использование XMLHttpRequest](/ru/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest) +- [Использование XMLHttpRequest](/ru/docs/Web/API/XMLHttpRequest_API/Using_XMLHttpRequest) diff --git a/files/ru/web/api/xmlhttprequest/getresponseheader/index.md b/files/ru/web/api/xmlhttprequest/getresponseheader/index.md index dc4cf9947188af..e0b18e3590bfb8 100644 --- a/files/ru/web/api/xmlhttprequest/getresponseheader/index.md +++ b/files/ru/web/api/xmlhttprequest/getresponseheader/index.md @@ -45,4 +45,4 @@ client.onreadystatechange = function () { ## Смотрите также -- [Использование XMLHttpRequest](/ru/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest) +- [Использование XMLHttpRequest](/ru/docs/Web/API/XMLHttpRequest_API/Using_XMLHttpRequest) diff --git a/files/ru/web/api/xmlhttprequest/index.md b/files/ru/web/api/xmlhttprequest/index.md index add83f08e7d354..cb84e64e2c629a 100644 --- a/files/ru/web/api/xmlhttprequest/index.md +++ b/files/ru/web/api/xmlhttprequest/index.md @@ -15,7 +15,7 @@ XMLHttpRequest изначально был разработан Microsoft и п var myRequest = new XMLHttpRequest(); ``` -более детальное описание создание объекта, можно увидеть в разделе [Using XMLHttpRequest](/ru/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest). +более детальное описание создание объекта, можно увидеть в разделе [Using XMLHttpRequest](/ru/docs/Web/API/XMLHttpRequest_API/Using_XMLHttpRequest). ## Список методов объекта diff --git a/files/ru/web/api/xmlhttprequest/loadstart_event/index.md b/files/ru/web/api/xmlhttprequest/loadstart_event/index.md index 846b6009e920e5..ec9d3bb4621f13 100644 --- a/files/ru/web/api/xmlhttprequest/loadstart_event/index.md +++ b/files/ru/web/api/xmlhttprequest/loadstart_event/index.md @@ -43,4 +43,4 @@ slug: Web/API/XMLHttpRequest/loadstart_event ## Смотрите также -- [Отслеживание состояния загрузки](/ru/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest#Monitoring_progress) +- [Отслеживание состояния загрузки](/ru/docs/Web/API/XMLHttpRequest_API/Using_XMLHttpRequest#Monitoring_progress) diff --git a/files/ru/web/api/xmlhttprequest/open/index.md b/files/ru/web/api/xmlhttprequest/open/index.md index 153be7818c21d6..59fe644eeb26fb 100644 --- a/files/ru/web/api/xmlhttprequest/open/index.md +++ b/files/ru/web/api/xmlhttprequest/open/index.md @@ -42,7 +42,7 @@ XMLHttpRequest.open(method, url[, async[, user[, password]]]) ## Смотрите также -- [Использование XMLHttpRequest](/ru/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest) +- [Использование XMLHttpRequest](/ru/docs/Web/API/XMLHttpRequest_API/Using_XMLHttpRequest) - {{domxref("XMLHttpRequest.setRequestHeader", "setRequestHeader()")}} - {{domxref("XMLHttpRequest.send", "send()")}} - {{domxref("XMLHttpRequest.abort", "abort()")}} diff --git a/files/ru/web/api/xmlhttprequest/response/index.md b/files/ru/web/api/xmlhttprequest/response/index.md index 991ad9b987bdf0..6fa633a0548273 100644 --- a/files/ru/web/api/xmlhttprequest/response/index.md +++ b/files/ru/web/api/xmlhttprequest/response/index.md @@ -65,5 +65,5 @@ function load(url, callback) { ## Смотрите также -- [Using XMLHttpRequest](/ru/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest) +- [Using XMLHttpRequest](/ru/docs/Web/API/XMLHttpRequest_API/Using_XMLHttpRequest) - Getting text and HTML/XML data: {{domxref("XMLHttpRequest.responseText")}} and {{domxref("XMLHttpRequest.responseXML")}} diff --git a/files/ru/web/api/xmlhttprequest/send/index.md b/files/ru/web/api/xmlhttprequest/send/index.md index fc2817ec3c4b5f..3a52f09cf2ac69 100644 --- a/files/ru/web/api/xmlhttprequest/send/index.md +++ b/files/ru/web/api/xmlhttprequest/send/index.md @@ -89,5 +89,5 @@ xhr.send("foo=bar&lorem=ipsum"); ## Смотрите также -- [Использование XMLHttpRequest](/ru/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest) +- [Использование XMLHttpRequest](/ru/docs/Web/API/XMLHttpRequest_API/Using_XMLHttpRequest) - [HTML in XMLHttpRequest](/ru/docs/Web/API/XMLHttpRequest/HTML_in_XMLHttpRequest) diff --git a/files/ru/web/api/xmlhttprequest/setrequestheader/index.md b/files/ru/web/api/xmlhttprequest/setrequestheader/index.md index e66ec67387900d..4c45f480d2e146 100644 --- a/files/ru/web/api/xmlhttprequest/setrequestheader/index.md +++ b/files/ru/web/api/xmlhttprequest/setrequestheader/index.md @@ -36,4 +36,4 @@ XMLHttpRequest.setRequestHeader(header, value) ## Смотрите также -[Использование XMLHttpRequest](/ru/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest) +[Использование XMLHttpRequest](/ru/docs/Web/API/XMLHttpRequest_API/Using_XMLHttpRequest) diff --git a/files/ru/web/api/xmlhttprequest/timeout/index.md b/files/ru/web/api/xmlhttprequest/timeout/index.md index 02f3b0a535f50f..beaa52cfd98df1 100644 --- a/files/ru/web/api/xmlhttprequest/timeout/index.md +++ b/files/ru/web/api/xmlhttprequest/timeout/index.md @@ -5,9 +5,9 @@ slug: Web/API/XMLHttpRequest/timeout {{APIRef('XMLHttpRequest')}} -Свойство **`XMLHttpRequest.timeout`** определяет количество миллисекунд, которое запрос будет выполняться, до того, как будет автоматически прерван. Имеет размер `unsigned long.` Значение по умолчанию - 0, определяет, что таймаута нет. Таймаут не должен быть использован в синхронных запросах XMLHttpRequests в {{Glossary('среде документа')}}, или будет вызвано исключение `InvalidAccessError`. Когда случается таймаут - вызывается событие [timeout](/ru/docs/Web/Events/timeout). +Свойство **`XMLHttpRequest.timeout`** определяет количество миллисекунд, которое запрос будет выполняться, до того, как будет автоматически прерван. Имеет размер `unsigned long.` Значение по умолчанию - 0, определяет, что таймаута нет. Таймаут не должен быть использован в синхронных запросах XMLHttpRequests в {{Glossary("document environment", "среде документа")}}, или будет вызвано исключение `InvalidAccessError`. Когда случается таймаут - вызывается событие [timeout](/ru/docs/Web/Events/timeout). -> **Примечание:** вы не можете использовать таймаут для синхронных запросов с окном - владельцем.[Использование таймаута с асинхронными запросами](/ru/docs/Web/API/XMLHttpRequest/Synchronous_and_Asynchronous_Requests#Example_using_a_timeout) +> **Примечание:** вы не можете использовать таймаут для синхронных запросов с окном - владельцем. [Использование таймаута с асинхронными запросами](/ru/docs/Web/API/XMLHttpRequest_API/Synchronous_and_Asynchronous_Requests#пример_использование_timeout) В Internet Explorer, свойство timeout может быть установлено только после вызова метода [open()](/ru/docs/Web/API/XMLHttpRequest/open) и до вызова метода [send()](/ru/docs/Web/API/XMLHttpRequest/send). diff --git a/files/ru/web/api/xmlhttprequest/xmlhttprequest/index.md b/files/ru/web/api/xmlhttprequest/xmlhttprequest/index.md index cab705ba5850bb..03beef844c54ea 100644 --- a/files/ru/web/api/xmlhttprequest/xmlhttprequest/index.md +++ b/files/ru/web/api/xmlhttprequest/xmlhttprequest/index.md @@ -7,7 +7,7 @@ slug: Web/API/XMLHttpRequest/XMLHttpRequest Конструктор **`XMLHttpRequest()`** создаёт новый объект {{domxref("XMLHttpRequest")}}. -Для получения подробной информации о том, как использовать `XMLHttpRequest`, см. [Использование XMLHttpRequest](/ru/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest). +Для получения подробной информации о том, как использовать `XMLHttpRequest`, см. [Использование XMLHttpRequest](/ru/docs/Web/API/XMLHttpRequest_API/Using_XMLHttpRequest). ## Синтаксис @@ -44,5 +44,5 @@ const request = new XMLHttpRequest(paramsDictionary); ## Смотрите также -- [Использование XMLHttpRequest](/ru/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest) +- [Использование XMLHttpRequest](/ru/docs/Web/API/XMLHttpRequest_API/Using_XMLHttpRequest) - [HTML в XMLHttpRequest](/ru/docs/Web/API/XMLHttpRequest/HTML_in_XMLHttpRequest) diff --git a/files/ru/web/api/xmlhttprequest_api/synchronous_and_asynchronous_requests/index.md b/files/ru/web/api/xmlhttprequest_api/synchronous_and_asynchronous_requests/index.md index 49c66ec678ddf9..fadd8807b16c3c 100644 --- a/files/ru/web/api/xmlhttprequest_api/synchronous_and_asynchronous_requests/index.md +++ b/files/ru/web/api/xmlhttprequest_api/synchronous_and_asynchronous_requests/index.md @@ -1,7 +1,6 @@ --- title: Синхронные и асинхронные запросы slug: Web/API/XMLHttpRequest_API/Synchronous_and_Asynchronous_Requests -original_slug: Web/API/XMLHttpRequest/Synchronous_and_Asynchronous_Requests --- `XMLHttpRequest` поддерживает как синхронные, так и асинхронные запросы. В основном предпочтительно использовать асинхронные запросы вместо синхронных из-за соображений производительности. @@ -234,9 +233,7 @@ function logData() { } ``` -## See also +## Смотрите также -- [`XMLHttpRequest`](/ru/docs/Web/API/XMLHttpRequest) -- [Using XMLHttpRequest](/ru/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest) -- [AJAX](/ru/docs/Web/Guide/AJAX) +- [Использование XMLHttpRequest](/ru/docs/Web/API/XMLHttpRequest_API/Using_XMLHttpRequest) - [`navigator.sendBeacon`](/ru/docs/Web/API/Navigator/sendBeacon) diff --git a/files/ru/web/api/xmlhttprequest_api/using_formdata_objects/index.md b/files/ru/web/api/xmlhttprequest_api/using_formdata_objects/index.md index 3155f205d0b9aa..3192d67e798ce8 100644 --- a/files/ru/web/api/xmlhttprequest_api/using_formdata_objects/index.md +++ b/files/ru/web/api/xmlhttprequest_api/using_formdata_objects/index.md @@ -149,11 +149,11 @@ $.ajax({ ## Отправка форм и файлов при помощи AJAX _без использования_ объекта `FormData` -Если вы заинтересованы в отправке форм и файлов при помощи [AJAX](/ru/docs/AJAX) _без использования_ FormData, прочитайте [/ru/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest#Submitting_forms_and_uploading_files](/ru/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest#Submitting_forms_and_uploading_files) +Если вы заинтересованы в отправке форм и файлов при помощи [AJAX](/ru/docs/AJAX) _без использования_ FormData, прочитайте [/ru/docs/Web/API/XMLHttpRequest_API/Using_XMLHttpRequest#Submitting_forms_and_uploading_files](/ru/docs/Web/API/XMLHttpRequest_API/Using_XMLHttpRequest#Submitting_forms_and_uploading_files) ## See also -- [Using XMLHttpRequest](/ru/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest) +- [Using XMLHttpRequest](/ru/docs/Web/API/XMLHttpRequest_API/Using_XMLHttpRequest) - {{domxref("HTMLFormElement")}} - {{domxref("Blob")}} - [Typed Arrays](/ru/docs/Web/JavaScript/Typed_arrays) diff --git a/files/ru/web/api/xmlhttprequest_api/using_xmlhttprequest/index.md b/files/ru/web/api/xmlhttprequest_api/using_xmlhttprequest/index.md index db250eb4d156ba..28e338356ac1d3 100644 --- a/files/ru/web/api/xmlhttprequest_api/using_xmlhttprequest/index.md +++ b/files/ru/web/api/xmlhttprequest_api/using_xmlhttprequest/index.md @@ -1,7 +1,6 @@ --- title: Использование XMLHttpRequest slug: Web/API/XMLHttpRequest_API/Using_XMLHttpRequest -original_slug: Web/API/XMLHttpRequest/Using_XMLHttpRequest --- {{APIRef("XMLHttpRequest")}} @@ -27,7 +26,7 @@ req.send(); Запрос, сделанный посредством `XMLHttpRequest`, может загружать данные синхронно или асинхронно. Тип запроса определяется опциональным `async` аргументом (третий по счёту) метода {{domxref("XMLHttpRequest.open()")}}. Если он равен `true` или не задан, запрос выполнится асинхронно, в противном случае — синхронно. -В чем разница между двумя типами запросов, а так же примеры использования, вы можете найти [в статье с подробным описанием синхронных и асинхронных запросов](/ru/docs/Web/API/XMLHttpRequest/Synchronous_and_Asynchronous_Requests). По возможности избегайте синхронных запросов, они блокируют взаимодействие пользователя с сайтом. +В чем разница между двумя типами запросов, а так же примеры использования, вы можете найти [в статье с подробным описанием синхронных и асинхронных запросов](/ru/docs/Web/API/XMLHttpRequest_API/Synchronous_and_Asynchronous_Requests). По возможности избегайте синхронных запросов, они блокируют взаимодействие пользователя с сайтом. > **Обратите внимание:** Название `XMLHttpRequest` не означает, что вы можете передавать только XML документы. **"XML"** в названии остался из времён, когда основным форматом для обмена информацией был XML. @@ -833,10 +832,6 @@ req.send(null); Если в завершение XMLHttpRequest вы получаете `status=0` и `statusText=null` – это означает, что запрос не был разрешен к выполнению. Его статус остался [`UNSENT`](https://xhr.spec.whatwg.org/#dom-xmlhttprequest-unsent). Частая причина, что указанный [`XMLHttpRequest` origin](https://html.spec.whatwg.org/multipage/webappapis.html#concept-settings-object-origin) (во время создания XMLHttpRequest) был изменён в следствии вызова `open()`. Такое может произойти, например, когда есть XMLHttpRequest, который запускается при событии onunload окна. XMLHttpRequest создается, когда окно, которое должно быть закрыто, всё ещё существует, но отправка запроса (другими словами, вызов `open()`) происходит, когда это окно уже потеряло свой фокус, а другое – получило. Наиболее эффективный способ избежать этой проблемы - установить слушателя на событие нового окна {{domxref("Element/DOMActivate_event", "DOMActivate")}}, которое устанавливается, как только у закрытого окна срабатывает событие {{domxref("Window/unload_event", "unload")}}. -## Воркеры - -Установка `overrideMimeType` не работает с {{domxref("Worker")}}. Это баг – [Firefox bug 678057](https://bugzil.la/678057). В разных браузерах поведение может отличаться. - ## Спецификации {{Specifications}} @@ -847,9 +842,8 @@ req.send(null); ## Смотрите также -- [AJAX. С чего начать](/ru/docs/Web/Guide/AJAX/Getting_Started) -- [HTML in XMLHttpRequest](/ru/docs/Web/API/XMLHttpRequest/HTML_in_XMLHttpRequest) -- [HTTP access control](/ru/docs/Web/HTTP/CORS) +- [Использование Fetch API](/ru/docs/Web/API/Fetch_API/Using_Fetch) +- [HTML в XMLHttpRequest](/ru/docs/Web/API/XMLHttpRequest_API/HTML_in_XMLHttpRequest) +- [Контроль доступа в HTTP](/ru/docs/Web/HTTP/CORS) - [XMLHttpRequest - REST and the Rich User Experience](https://www.peej.co.uk/articles/rich-user-experience.html) -- ["Using the XMLHttpRequest Object" (jibbering.com)](https://jibbering.com/2002/4/httprequest.html) - [Объект `XMLHttpRequest`: спецификация WHATWG](https://xhr.spec.whatwg.org/) diff --git a/files/ru/web/guide/ajax/index.md b/files/ru/web/guide/ajax/index.md deleted file mode 100644 index ed162b108b3669..00000000000000 --- a/files/ru/web/guide/ajax/index.md +++ /dev/null @@ -1,32 +0,0 @@ ---- -title: AJAX -slug: Web/Guide/AJAX ---- - -## Введение в AJAX - -**AJAX** (англ. _Asynchronous JavaScript and XML_ — асинхронный JavaScript и XML) — это не технология сама по себе, а термин, который описывает «новый» подход к использованию существующих технологий вместе. AJAX включает: [HTML](/ru/HTML) или [XHTML](/ru/XHTML), [CSS](/ru/CSS), [JavaScript](/ru/JavaScript), [DOM](/ru/DOM), [XML](/ru/XML), [XSLT](/Ru/XSLT), и [объект XMLHttpRequest](/ru/XMLHttpRequest). Когда эти технологии объединяются в модель AJAX, web-приложения способны делать быстрые дополняющие обновления интерфейса пользователя без необходимости полной перезагрузки страницы браузером. Приложения работают быстрее и становятся более отзывчивыми к действиям пользователей. - -## Документация - -- [AJAX: С чего начать?](/ru/docs/Web/Guide/AJAX/%D0%A1_%D1%87%D0%B5%D0%B3%D0%BE_%D0%BD%D0%B0%D1%87%D0%B0%D1%82%D1%8C) - - : Эта статья, описывающая основы AJAX и содержащая два простых примера, позволит быстро начать работу. -- [Ajax: Новый подход к WEB-приложениям](/ru/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest) - - : Jesse James Garrett из [adaptive path](http://www.adaptivepath.com), создавший эту статью в феврале 2005 года, знакомит с AJAX и связанными с ним понятиями. -- [Простой путь Ajax](http://www.onlamp.com/pub/a/onlamp/2005/05/19/xmlhttprequest.html) - - : "Как это оказывается, довольно легко использовать в своих интересах объект XML-HttpRequest сделает акт приложений сети больше как настольное приложение, все ещё используя традиционные инструменты , сеть формируется для того, чтобы собрать пользовательский вход." -- [Fixing the Back Button and Enabling Bookmarking for AJAX Apps](http://www.contentwithstyle.co.uk/Articles/38/fixing-the-back-button-and-enabling-bookmarking-for-ajax-apps) - - : Mike Stenhouse has penned this article, detailing some methods you can use to fix back button and bookmarking issues when developing AJAX applications. -- [Ошибки использования Ajax](http://alexbosworth.backpackit.com/pub/67688) - - : Alex Bosworth написал эту статью, где описал некоторые ошибки которые могут сделать разработчики приложений AJAX. - -## Инструменты - -- [Toolkits and frameworks](http://www.ajaxprojects.com) -- [Отладчик AJAX](http://blog.monstuff.com/archives/000252.html) -- [Flash/AJAX Integration Kit](http://www.osflash.org/doku.php?id=flashjs) -- [AJAX: many cool examples](http://www.hotajax.org) - -## Связанные темы - -- [HTML](/ru/HTML), [XHTML](/ru/XHTML), [CSS](/ru/CSS), [DOM](/ru/DOM), [JavaScript](/ru/JavaScript), [XML](/ru/XML), [XMLHttpRequest](/ru/XMLHttpRequest), [XSLT](/Ru/XSLT), [DHTML](/ru/DHTML) diff --git a/files/ru/web/guide/index.md b/files/ru/web/guide/index.md index 51ffe64e2e9a2f..8256e6edaaea9b 100644 --- a/files/ru/web/guide/index.md +++ b/files/ru/web/guide/index.md @@ -20,8 +20,6 @@ slug: Web/Guide - Шаблонами проектирования, используемыми для асинхронной обработки инцидентов, возникающих в жизненном цикле веб страницы - Именованием, характеризацией и использованием большого количества инцидентов различного типа -- [AJAX](/ru/docs/Web/Guide/AJAX) - - : Это не технология сама по себе, а термин, который описывает «новый» подход к использованию существующих технологий вместе. AJAX включает: HTML или XHTML, CSS, JavaScript, DOM, XML, XSLT, и объект XMLHttpRequest. Когда эти технологии объединяются в модель AJAX, web-приложения способны делать быстрые дополняющие обновления интерфейса пользователя без необходимости полной перезагрузки страницы браузером. Приложения работают быстрее и становятся более отзывчивыми к действиям пользователей. - [Графика для Web](/ru/docs/Web/Guide/Графика) - : Современным веб-сайтам и веб-приложениям часто требуется отображать графику. - [Уроки по Web API](/ru/docs/Web/Guide/API) diff --git a/files/ru/web/http/permissions_policy/index.md b/files/ru/web/http/permissions_policy/index.md index 0c9408aa6e9258..f482cbc82e202e 100644 --- a/files/ru/web/http/permissions_policy/index.md +++ b/files/ru/web/http/permissions_policy/index.md @@ -18,7 +18,7 @@ Feature Policy позволяет веб-разработчику выбороч - Изменить поведение автозапуска видео на мобильных устройствах. - Ограничить доступ сайта к камере и микрофону. - Разрешить использование API полноэкранного режима в iframe. -- Блокировать использование устаревших API, например [synchronous XHR](/ru/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest) and {{domxref("document.write()")}}. +- Блокировать использование устаревших API, например [synchronous XHR](/ru/docs/Web/API/XMLHttpRequest_API/Using_XMLHttpRequest) and {{domxref("document.write()")}}. - Проверять соответствие размера изображений размерам области просмотра. ## Concepts and usage