JavaScript. Подробное руководство, 6-е издание, Флэнаган Дэвид

JavaScript. Подробное руководство, 6-е издание

на обложку

Флэнаган Дэвид

Шрифт:

var div = document.createElementC'div"); // Создать <div>

div.appendChild(node); // Добавить текст, узел в div

document.body.insertBefore(div, input); // И добавить div перед input

input.scrollIntoView; // Прокрутить до появления

} // input в видимой области

// Передавать сообщения

пользователя на сервер с помощью XMLHttpRequest

input.onchange = function { // При нажатии клавиши Enter

var msg = nick + ": " + input.value; // Имя пользователя + введ. текст

var xhr = new XMLHttpRequest; // Создать новый XHR

xhr.open("POST", "/chat"); // POST-запрос к /chat,

xhr.setRequestHeader("Content-Type", // Тип - простой текст UTF-8

"text/plain;charset=UTF-8");

xhr.send(msg); // Отправить сообщение

input.value = ""; // Приготовиться к вводу

} // следующего сообщения

};

</script>

<input id="input" style="width:100%"/>

На момент написания этих строк объект

EventSource

поддерживался в Chrome и Safari и должен был быть реализован компанией Mozilla в первом же выпуске Firefox, вышедшем после версии 4.0. В броузерах (таких как Firefox), где реализация объекта

XMLHttpRequest

возбуждает событие «readystatechange» в ходе загрузки ответа (для значения 3 в свойстве

readyState

) многократно, поведение объекта

EventSource

относительно легко имитировать с помощью объекта

XMLHttpRequest

, как демонстрируется в примере 18.16. С модулем имитации пример 18.15 будет работать в Chrome, Safari и Firefox. (Пример 18.16 не будет работать в броузерах ІE и Opera, поскольку реализации объекта

XMLHttpRequest

в этих броузерах не генерируют события в ходе загрузки.)

Пример 18.16. Имитация объекта

EventSource

с помощью

XMLHttpRequest

// Имитация прикладного интерфейса EventSource в броузерах, не поддерживающих его.

// Требует, чтобы XMLHttpRequest генерировал многократные события readystatechange

//

в ходе загрузки данных из долгоживущих HTTP-соединений. Учтите, что это не полноценная

// реализация API: она не поддерживает свойство readyState, метод close, а также

// события open и error. Кроме того, регистрация обработчика события message выполняется

// только через свойство onmessage -- эта версия не определяет метод addEventListener