Уроки JavaScript

В данном разделе содержатся уроки по Javascript. Они рассчитаны на тех кто хорошо знаком с HTML и CSS и помогут вам сделать ваши сайты адаптивными и динамичными. Все уроки представлены с примерами которые можно посмотреть в отдельном окне, также имеются задания к урокам.

COMET с XMLHttpRequest: непрерывные опросы

Здравствуйте! В этом уроке мы рассмотрим способ организации COMET, то есть непрерывного  потока получения данных с сервера, который очень прост и используется в 95% случаях. Где можно использовать COMET? Наверное при частых опросах сервера, когда  надо отслеживать изменение данных и реагировать на эти изменения.

comet частые опросы

Читать далее

XMLHttpRequest и возобновляемая закачка

Здравствуйте! В этой статье я  хочу рассказать о так называемой возобновляемой закачке во время запроса файла методом XMLHttpRequest.  Ведь он  даёт возможность загружать файл как угодно: во множество потоков, с догрузкой  и прочими вариантами.

XMLHttpRequest и возобновляемая закачка

Тут же мы рассмотрим подход к организации загрузки.

Читать далее

XMLHttpRequest: стадии закачки

Здравствуйте!  В этом уроке я  хочу  рассмотреть стадии  закачки  данных при  отправке запроса методом XMLHttpRequest.  Собственно сам  запрос  состоит из 2 фаз:

  1. Стадия закачки (upload). На ней данные как  раз  загружаются на сервер. Эта фаза может быть долгой для запросов типа  POST. Для отслеживания прогресса на стадии закачки существует  XMLHttpRequestUpload, доступный как xhr.upload.
  2. Стадия скачивания (download). После того, как данные загружены, браузер должен  скачать ответ с сервера. Если он большой, то это может занять длительное время. На этой стадии надо  использовать  обработчик xhr.onprogress.

Но давайте обо все по порядку.

Читать далее

XMLHttpRequest и кросс-доменные запросы

Здравствуйте! Обычно запрос XMLHttpRequest может делать запрос только на текущий сайт. При попытке использовать иной домен – браузер выдаёт ошибку. Делается  это из соображений  безопасности,  чтобы не  было  возможности провести атаку типа XSS взлом.

Существует и современный стандарт XMLHttpRequest, он ещё правда в состоянии черновика, но предусматривает кросс-доменные запросы и многое другое.

Большинство возможностей этого стандарта уже поддерживаются всеми браузерами.

кроссдоменные запросы xmlhttprequest

Читать далее

XMLHttpRequest метод POST

Здравствуйте! В этом уроке  рассмотрим, что происходит при отправке данных  формы методом POST.

Во время отправки формы браузер собирает значения всех полей и делает из них строку, а после  составляет тело GET/POST-запроса для отсылки на сервер.

xmlhttprequest метод post отправки данных

А при отправке данных через XMLHttpRequest, это нужно делать самостоятельно, в JS-коде. Большинство проблем и вопросов  возникает как  раз  с кодировкой. Вот именно  об этих вопросах мы и  поговорим  в этой статье.

Читать далее

Основы объекта XMLHttpRequest

Здравствуйте!  Продолжаем  разбираться с AJAX  и в  этом уроке я разберу пожалуй  главный объект без которого трудно себе представить  технологию AJAX —  XMLHttpRequest (или, сокращенно  «XHR»)  он дает возможность из JavaScript делать HTTP-запросы к серверу без перезагрузки страницы, то есть это и есть AJAX.

Несмотря на,  то что в  название присутствует  слово «XML», XMLHttpRequest может работать в принципе  с любыми данными, а не только с XML.

объект xmlhttprequest

Использовать его очень просто. Давайте рассмотрим примеры.

Читать далее

Введение в AJAX

Здравствуйте! В этой  статье мы «обзорно», на уровне возможностей рассмотрим  такую технологию, как  AJAX. Пока что  очень поверхностно

Данный материал будет  полезен для понимания что такое AJAX и  для чего он нужен.

Что такое ajax

Что такое AJAX?

AJAX (аббревиатура от «Asynchronous Javascript And Xml») – технология обращения к серверу без перезагрузки страницы.

За счет этого уменьшается время отклика веб-страницы и веб-приложение по интерактивности больше напоминает десктоп.

Несмотря на то, что в названии технологии присутствует буква X (от слова XML), использовать XML вовсе не обязательно. Дело в том, что  технология XML уже  устарела и отходит в прошлое.

В  принципе под  AJAX понимают любое общение с сервером без перезагрузки страницы, организованное при помощи JavaScript.
Читать далее

Объект Screen. Как узнать размеры экрана пользователя

Здравствуйте!  Да думал, что урок  по объекту Navigator будет последним в теме «Работа с BOM», но как оказалось я совсем забыл про еще один полезный объект screen. Благодаря объекту screen можно узнать размеры экрана пользователя, а соответственно это можно использовать для  адаптивного дизайна.

Объект screen

 

  • screen.width — возвращает ширину экрана монитора
  • screen.height —  возвращает  высоту экрана монитора
  • screen.availWidth — возвращает полезную  ширину экрана
  • screen.availHeight — возвращает полезную высоту экрана
  • screen.colorDepth — возвращает глубину цвета. Измеряется в бит/пиксель.

Читать далее

Получение справочной информации о посетителях. Объект navigator

Здравствуйте! В этом заключительном уроке по  объектам браузера (BOM) я  хочу рассмотреть такой интересный объект, как navigator.   Этот объект  содержит информацию о браузере и операционной системе, в которой собственно браузер и запущен. Он имеет ряд свойств и методов, основным из которых является свойство userAgent, представляющее браузер  посетителя:

    • appCodeName — Показывает  кодовое имя браузера.
    • appName — Показывает имя браузера.
    • appVersion — Показывает   версию браузера.
    • cookieEnabled — Проверяет включена или нет поддержка cookie у пользователя.
    • platform —  Показывает  платформу, под которую  был скомпилирован браузер пользователя.
    • userAgent — Показывает  полную информацию о браузере пользователя.

Объект navigator

Читать далее

Объект location

Здравствуйте! Продолжаем знакомиться с браузерной моделью BOM.  И сегодня на очереди у нас очень интересный объект  location, который  содержит информацию о расположении текущей веб-страницы: URL (адрес страницы), информацию о сервере, номер порта, протокол. С помощью свойств  этого объекта вы можете получить такую информацию:

  • href: полный адрес  узла
  • pathname: путь к узлу
  • origin: схема запроса
  • protocol:  используемый протокол  обычно http или https
  • port: порт, как  правило 80
  • host: имя сервера
  • hostname: название сервера
  • hash: если в строке запроса содержится  символ решетки (#), то это свойство вернет  ту часть строки, которая идет после этого символа
  • search: если в строке запроса содержится знак вопроса (?),  то данное свойство вернет ту часть строки, которая идет после знака вопроса

bom модель в javascript
Читать далее

Сообщить об опечатке

Текст, который будет отправлен нашим редакторам: