# Общий обзор возможностей JS в браузере и самого браузера. ## Браузер Браузер - программа с богатыми возможностями: - Получение данных по сети - Отображение полученных данных (HTML, CSS, Изображения) - Выполнение Javascript-кода, добавляющего логику и интерактивность в веб-страницах. - Отправка данных в сеть (на сервер), используя возможности HTML и из Javascript ### JS в браузере: - Может выполнять произвольный корректный JS-код - Может оперировать с другими частями страницы (HTML, CSS), делать с ними *что угодно*, меняя логику работы и внешний вид страницы - Может отправлять данные по сети, на сервер, с которого получена страница, или же на другие сервера, а так же открывать сетевые соединения, общаться с другими такими же браузерами для передачи данных, видео и голосовых конференций. - Может открывать и обрабатывать файлы на компьютере пользователя, отправлять их в интернет; - В современных мобильных браузерах у вас есть почти полный доступ к возможностям мобильного гаджета: * Геолокация * Фотография * Акселерометр - Canvas, как возможность для рисования чего угодно - графические примитивы (окружности, линии, текст), а так же попиксельного рисования (т. е. задания цвета каждой точки в отдельности) - WebGL, как зачатки 3D в браузере. ### Основные вехи развития браузера и JS в нём: - **Первая эра**. 90е-начало 00х годов. В этот период сайты представляли из себя книги для чтения, *всего-лишь* с возможностью перейти по ссылке на другой сайт или страницу. JS был в начале становления и практически не применялся - **Вторая эра**. Появился CSS, как отдельная сущность для оформления вида страниц. В JS появился AJAX, как возможность инициировать общение с сервером незаметно для пользователя, получать данные и отправлять их без перезагрузки страниц. Появляются формы, валидация данных в них, веб становится более интерактивным, в том числе благодаря flash - **Третья эра**. HTML5. HTML5 взял на себя множество вещей, которые требовали ранее более сложных решений, JS или Flash. Многие эффекты теперь являются частью CSS, и не требуют программирования. Так же появились Canvas, WebGL, возможности смартфонов и так далее, WebRTC. ### HTML **HTML** (Hypertext Markup Language) - язык разметки *гипертекста*. Под гипертекстом подразумевается множество ресурсов с текстовой информацией, объединенных с помощью *гиперссылок*. В процессе развития HTML оброс кучей дополнительных возможностей. #### Структура HTML: ```html Site Title ``` Как видите, **HTML** - это *древовидная структура данных*, представленная в виде парных тэгов (например `` и ``), которые могут хранить вложенные тэги (`` и ``) и так далее. В `` находится заголовок документа с настройками - кодировкой, именем страницы и так далее; в `` - собственно тело документа. В общем случае любые тэги могут быть внутри любых других тэгов, однако из этого правила много исключений. ##### Ссылки в HTML. Ссылки в HTML используются для двух основных целей: для отображения пользователю с возможностью перехода, или же для каких-то технических целей. ```html google яндекс ``` Эти ссылки для пользователя. А эти - для технических целей. Именно они подключают ваш JS и CSS код в документ в repl.it: ```html .... ``` Ссылки представлены в формате **URL**: <протокол>://<сайт>/путь/к/файлу