Последние учебники веб-разработки
×

XML Руководство

XML ГЛАВНАЯ XML Введение XML Как использовать XML дерево XML Синтаксис XML элементы XML Атрибуты XML Пространства имен XML дисплей XML XSLT XML XPath XML XLink XML Оценщик XML DTD XML схема XML сервер XML Приложения XML Примеры XML викторина XML сертификат

XML DOM

DOM вступление DOM Вершины DOM XMLHttpRequest DOM Доступ к DOM Узел информация DOM Список узлов DOM Пересекая DOM навигационный DOM Получить значения DOM Change Вершины DOM Remove Вершины DOM Replace Вершины DOM Create Вершины DOM Add Вершины DOM Clone Вершины DOM Примеры

DOM Справка

DOM Типы узлов DOM Узел DOM NodeList DOM NamedNodeMap DOM Документ DOM Элемент DOM Атрибут DOM Текст DOM CDATA DOM Комментарий DOM XMLHttpRequest DOM синтаксический анализатор

XML DTD

DTD вступление DTD Строительные блоки DTD элементы DTD Атрибуты DTD Элементы против Attr DTD юридические лица DTD Примеры

XSD Schema

XSD вступление XSD Как XSD <schema> XSD элементы XSD Атрибуты XSD ограничения

XSD Сложный

XSD элементы XSD пустой XSD Элементы только XSD Только текст XSD смешанный XSD индикаторы XSD <any> XSD <anyAttribute> XSD подмена XSD пример

XSD Data

XSD строка XSD Дата XSD числовой XSD Разное XSD Справка

Web Сервисы

XML Сервисы XML WSDL XML SOAP XML RDF XML RSS

 

Объект XMLHttpRequest


Все современные браузеры имеют встроенный XMLHttpRequest объект, чтобы запрашивать данные с сервера.

Все основные браузеры имеют встроенный XML-анализатор для доступа и управления XML.


Объект XMLHttpRequest

Объект XMLHttpRequest может быть использован для запроса данных с веб-сервера.

Объект XMLHttpRequest является a developers dream , потому что вы можете:

  • Обновление веб-страницы без перезагрузки страницы
  • Запрос данных с сервера - после загрузки страницы
  • Получение данных с сервера - после загрузки страницы
  • Отправка данных на сервер - в фоновом режиме

XMLHttpRequest Пример

При вводе символа в поле ввода , ниже, XMLHttpRequest отправляется на сервер, а также некоторые предложения имя возвращаются (from the server) :

пример

Start typing a name in the input field below:

Name:

Suggestions:


Отправка XMLHttpRequest

Все современные браузеры имеют встроенный объект XMLHttpRequest.

Общий синтаксис JavaScript для его использования выглядит следующим образом:

пример

var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
    if (xhttp.readyState == 4 && xhttp.status == 200) {
       // Action to be performed when the document is read;
    }
};
xhttp.open("GET", " filename ", true);
xhttp.send();
Попробуй сам "

Создание объекта XMLHttpRequest

Первая строка в приведенном выше примере создает XMLHttpRequest Objet:

var xhttp = new XMLHttpRequest();

Onreadystatechange Событие

ReadyState свойство содержит статус XMLHttpRequest.

Событие onreadystatechange срабатывает каждый раз , когда readyState изменения.

Во время запроса сервера, readyState изменяется от 0 до 4:

0: Запрос не инициализирован
1: соединение с сервером установлено
2: запрос получен
3: обработка запроса
4: просить закончен и будет готов

В onreadystatechange собственности, указать функцию, которая будет выполняться, когда readyState изменения:

xhttp.onreadystatechange = function()

Когда readyState равно 4, и состояние 200, ответ готов:

if (xhttp.readyState == 4 && xhttp.status == 200)

XMLHttpRequest Свойства и методы

метод Описание
new XMLHttpRequest() Создает новый объект XMLHttpRequest
open( method, url, async ) Определяет тип запроса
method : тип запроса: GET или POST
url : расположение файла
async : истинный (asynchronous) или ложным (synchronous)
send() Посылает запрос на сервер (used for GET)
send( string ) Посылает строку запроса на сервер (used for POST)
onreadystatechange Функция, которая вызывается при изменении свойства readyState
readyState Статус XMLHttpRequest
0: Запрос не инициализирован
1: соединение с сервером установлено
2: запрос получен
3: обработка запроса
4: просить закончен и будет готов
status 200: OK
404 Страница не найдена
responseText Данные ответа в виде строки
responseXML Данные отклика в виде данных XML

Доступ через домены

По соображениям безопасности, современные браузеры не позволяют доступа между доменами.

Это означает, что как веб-страницы и файл XML он пытается загрузить, должен находиться на том же сервере.

Примеры на w3ii все открытые файлы XML, расположенные на w3ii домене.

Если вы хотите использовать приведенный выше пример на одном из ваших собственных веб-страниц, файлы XML вы нагрузка должна быть расположена на собственном сервере.


ResponseText недвижимости

Свойство responseText возвращает ответ в виде строки.

Если вы хотите использовать ответ в виде текстовой строки, используйте свойство responseText:

пример

document.getElementById("demo").innerHTML = xmlhttp.responseText;
Попробуй сам "

ResponseXML недвижимости

Свойство responseXML возвращает ответ как объект XML DOM.

Если вы хотите использовать в качестве ответа на объект XML DOM, следует использовать свойство responseXML:

пример

Запросить файл cd_catalog.xml и использовать ответ как объект XML DOM:

xmlDoc = xmlhttp.responseXML;
txt = "";
x = xmlDoc.getElementsByTagName("ARTIST");
for (i = 0; i < x.length; i++) {
    txt += x[i].childNodes[0].nodeValue + "<br>";
}
document.getElementById("demo").innerHTML = txt;
Попробуй сам "

GET или POST?

GET проще и быстрее, чем POST, и может использоваться в большинстве случаев.

Тем не менее, всегда использовать POST запросы, когда:

  • Кэшируемый файл не вариант (update a file or database on the server)
  • Отправка большого количества данных на сервер (POST не имеет ограничений по размеру)
  • Отправка пользовательского ввода (which can contain unknown characters) , POST является более надежной и безопасной , чем GET

URL - файл на сервере

Параметр URL в open() метод, является обращение к файлу на сервере:

xmlhttp.open("GET", "xmlhttp_info.txt", true);

Файл может быть любого типа файла, например .txt и .xml или файлы сценариев сервера, как .asp и .php (который может выполнять действия на сервере перед отправкой ответ обратно).


Асинхронный - Верно или нет?

Для того, чтобы отправить запрос в асинхронном режиме, параметр асинхронной из open() метод должен быть установлен верно:

xmlhttp.open("GET", "xmlhttp_info.txt", true);

Отправка асинхронно запрашивает огромный шаг вперед для веб-разработчиков. Многие из задач, выполняемых на сервере, очень много времени.

Отправляя асинхронном JavaScript не придется ждать ответа от сервера, но может вместо того, чтобы:

  • выполнять другие сценарии во время ожидания ответа сервера
  • иметь дело с ответом, когда ответ готов

Асинхронный = True

При использовании асинхр = True, задать функцию для выполнения, когда ответ готов в onreadystatechange события:

пример

xmlhttp.onreadystatechange = function() {
    if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
       document.getElementById("demo").innerHTML = xmlhttp.responseText;
    }
};
xmlhttp.open("GET", "xmlhttp_info.txt", true);
xmlhttp.send();
Попробуй сам "

Асинхронный = False

Чтобы использовать асинхр = ложь, измените третий параметр в open() метода к ложным:

xmlhttp.open("GET", "xmlhttp_info.txt", false);

Использование асинхр = False не рекомендуется, но в течение нескольких небольших запросов это может быть в порядке.

Помните, что JavaScript не будет продолжать выполняться, пока ответ сервера не будет готов. Если сервер занят или медленно, то приложение будет висеть или остановить.

Note: При использовании асинхронной = ложь, не пишите функцию onreadystatechange - просто поместите код после send() заявление:

пример

xmlhttp.open("GET", "xmlhttp_info.txt", false);
xmlhttp.send();
document.getElementById("demo").innerHTML = xmlhttp.responseText;
Попробуй сам "

XML Parser

Все современные браузеры имеют встроенный XML-анализатор.

Объектной модели документа XML (the XML DOM) содержит много методов для доступа и редактирования XML.

Тем не менее, до того, как XML-документ может быть доступен, он должен быть загружен в объект XML DOM.

XML-анализатор может читать обычный текст и преобразовать его в объект XML DOM.


Синтаксический текстовая строка

Этот пример анализирует текстовую строку в объект DOM XML, и извлекает информацию из него с JavaScript:

пример

<html>
<body>

<p id="demo"></p>

<script>
var text, parser, xmlDoc;

text = "<bookstore><book>" +
"<title>Everyday Italian</title>" +
"<author>Giada De Laurentiis</author>" +
"<year>2005</year>" +
"</book></bookstore>";

parser = new DOMParser();
xmlDoc = parser.parseFromString(text,"text/xml");

document.getElementById("demo").innerHTML =
xmlDoc.getElementsByTagName("title")[0].childNodes[0].nodeValue;
</script>

</body>
</html>
Попробуй сам "

Старые браузеры (IE5 and IE6)

Старые версии Internet Explorer (IE5 and IE6) не поддерживают объект XMLHttpRequest.

Чтобы справиться с IE5 и IE6, проверьте, поддерживает ли браузер объект XMLHttpRequest, либо создать ActiveXObject:

пример

if (window.XMLHttpRequest) {
    // code for modern browsers
    xmlhttp = new XMLHttpRequest();
 } else {
    // code for old IE browsers
    xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
Попробуй сам "

Старые версии Internet Explorer (IE5 and IE6) не поддерживают объект DOMParser.

Чтобы справиться с IE5 и IE6, проверьте, поддерживает ли браузер объект DOMParser, либо создать ActiveXObject:

пример

if (window.DOMParser) {
  // code for modern browsers
  parser = new DOMParser();
  xmlDoc = parser.parseFromString(text,"text/xml");
} else {
  // code for old IE browsers
xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
  xmlDoc.async = false;
  xmlDoc.loadXML(text);
Попробуй сам "

Примеры

Еще примеры

Получить информацию заголовка с getAllResponseHeaders()
Получить информацию заголовка ресурса (file) .

Получить конкретную информацию заголовка с getResponseHeader()
Получить конкретную информацию заголовка ресурса (file) .

Получить содержимое файла ASP
Как веб-страница может обмениваться данными с веб-сервером в то время как символы типа пользователя в поле ввода.

Извлечения содержимого из базы данных
Как веб-страница может извлечь информацию из базы данных с объектом XMLHttpRequest.

Получить содержимое файла XML
Создание XMLHttpRequest для извлечения данных из файла XML и отображать данные в HTML-таблице.