Нижегородский файловый портал
RSS - каналы
Главное меню
Категории каталога
Мои статьи [5]
Школа покера [5]
Софт [40]
Радиолюбителям и электрикам [8]
Интернет [167]
Система [89]
Комплектующие ПК [47]
Безопасность [56]
Программирование [18]
Веб-дизайнеру [5]
Игры [6]
Полезные советы [24]
Кулинария [1]
Телефония [10]
Мобильник [17]
Планшеты [14]
Медицина [5]
Работа [4]
Домашнему мастеру [0]
Строительство и ремонт [19]
Для сада и огорода [2]
Юмор и приколы [12]
Интересное [114]
Пластики [3]
Разное [238]
Мини-чат
Правила мини-чата



Мини-чат в окне
Погода в Нижнем
Яндекс.Погода
Главная » Статьи » Программирование

Онлайн-учебник JavaScript (Часть 1)


JavaScript – язык, используемый в составе web–страниц и позволяющий обеспечить двусторонее взаимодействие между сайтом и его посетителями, тем самым сильно повышая привлекательность сайта.

JavaScript был разработан фирмой Netscape на базе языка Java, разработанного корпорацией Sun. Хотя между этими языками есть некоторые общие черты, сами по себе они сильно отличаются и говорить об их родстве не представляется возможным.

Справочник JavaScript содержит достаточное количество информации для написания полноценных JavaScript программ и позволит Вам:
- создавать динамические страницы, реагирующие на действия пользователя
- обрабатывать элементы форм в режиме реального времени (проверка правильности ввода данных)
- создавать полноценные приложения, работающие в пределах сайта
- отслеживать действия, совершаемые пользователями ( куда пользователи кликали мышью, на каких страницах они провели больше всего времени)
- собирать достоверную информацию о пользователе, включая используемый браузер, город проживания и даже сайты, которым он отдает наибольшее предпочтение


Использование JavaScript позволяет вмешиваться в нормальный режим работы интернет – браузеров, тем самым изменяя алгоритм их работы, чем пользуются многие недобросовестные web–мастера, устанавливая таким образом вирусные программы на компьютеры обычных пользователей интернет.

JavaScript учебник, находящийся перед Вами, содержит четко структурированный справочник JavaScript , изучив который Вы сможете самостоятельно создавать полноценные приложения на этом популярнейшем языке программирования. Он не претендует на абсолютное пособие по всем возможностям языка, являясь в то же время простым и наглядным руководством по большинству наиболее используемых функций и операторов, нашедших реальное применение во многих успешных интернет–проектах.
 
JavaScript учебник позволит сделать Ваш сайт уникальным. Используйте JavaScript при создании своих сайтов и каждый из них будет уникальным и неповторимым, что несомненно оценят ваши посетители.

Итак, пришло время перейти непосредственно к урокам по изучению JavaScript.



Урок № 1  Введение в JavaScript

«Введение в JavaScript» – первый урок учебника JavaScript. В этом уроке речь пойдет об объектной модели представления документа в JavaScript. Мы рассмотрим устройство объектной модели документа и разберемся с такими понятиями, как свойства, методы и события в JavaScript.
 
Объектная модель JavaScript

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

  • свойства
  • методы
  • события
Объектная модель документа позволяет связать сам документ, браузер пользователя и его действия. Любой элемент страницы становится в глазах интерпретатора JavaScript отдельным объектом с уникальным набором методов и событий, к которым можно обратиться и изменить их в реальном времени, тем самым изменив в реальном времени сам документ. Объектная модель документа выстраивается только после полной загрузки документа.
 
Cвойства в JavaScript

У большинства элементов в HTML есть так называемые атрибуты, например атрибут href элемента <a>. В представлении интерпретатора JavaScript значения атрибутов элементов и есть свойства объектов. Говоря проще изменяя значения свойства объекта вы тем самым изменяете значения соответствующих атрибутов элементов HTML.

Не только элементы HTML разметки имеют свойства, но также и некоторые другие элементы страницы, не имеющие аналогов среди существующих HTML элементов. Такие, как объект Navigator, позволяющий управлять браузером и некоторые другие.

Методы

Методы JavaScript позволяют управлять изменением свойств объектов. Примерами методов работы с объектами могут стать  open(), write() и т.д. Эти методы позволяют сгенерировать или изменить содержание документа. Примерами других методов являются открытие и закрытие окон, нажатие кнопок.

События

Одним из наиболее важных инструментов работы с объектами в JavaScript является обработка событий. К примеру в разметке HTML существует элемент кнопки – button, на который пользователи могут нажимать. При помощи событий мы сможем отследить и обработать нажатие пользователя на эту кнопку при помощи обработчика события нажатия onClick. В значение обработчика события вписывается JavaScript код, который будет выполнен при нажатии пользователя на кнопку, как Вы можете это видеть ниже:

<INPUT TYPE=button VALUE="Вызов JavaScript " onClick="window.alert('Это JavaScript');">    

Событие может быть обработанно только после полной загрузки элемента, для которого это событие задано.

И, наконец, придется Вас немного огорчить, сказав, что объектные модели разных браузеров могут отличаться между собой. В большинстве случаев эти различия незначительны, но иногда ( не так часто) названия некоторых объектов и методов работы с ними могут кардинально различаться, поэтому, создавая программы на JavaScript Вы должны проверять их кроссбраузерность.

Этот урок является введением в JavaScript. Здесь мы бросили первый взгляд на работу с этим языком программирования. В следующем уроке мы обсудим способы размещения кода JavaScript в документе и еще несколько ключевых моментов работы с этим языком, таких например, как использование комментариев.



Урок № 2  JavaScript основы

«JavaScript Основы» – второй урок учебника JavaScript. В этом уроке мы поговорим о способах размещения JavaScript кода.

Давайте попробуем самостоятельно разместить JS коды внутри HTML страницы и научимся оставлять комментарии.

Способы размещения JavaScript кода

Прежде, чем начинать изучение любого существующего языка программирования необходимо научится запускать программы, написанные на этом языке и как это принято, первой программой, которую мы создадим будет простенький скрипт, вызывающий приветствие вроде «ПРИВЕТ, МИР!»

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

Для понимания JavaScript основ необходимо понять, как исполняются JavaScript коды. Для примера PHP код выполняется в момент получения команды на скачивание страницы сервером и пользователь получает уже обработанную сервером статическую страницу без каких–либо намеков на программный код.

В случае с JavaScript все состоит совершенно иначе (если не сказать наоборот). В момент получения сервером команды на скачивание страницы от браузера сервер передает браузеру страницу со встроенным кодом в ее первоначальном виде, то есть с содержанием программного кода (этот код Вы можете увидеть нажав в браузере команду показать исходный код).

Затем, уже сам браузер начинает выполнение кода, в зависимости от поведения пользователя и так как страница будет содержать этот код постоянно, пока Вы с ней работаете, то код может быть выполнен сколь угодно много раз, тем самым изменяя страницу в режиме реального времени, обеспечивая максимальное взаимодействие с пользователем, чего к примеру не может дать PHP код.

Теперь поговорим о способах встраивания JavaScript кода в страницы сайта. Основных способов существует 4:
  • вставка ссылкой
  • использование событий
  • подстановка
  • контейнер <SCRIPT></SCRIPT>
А теперь рассмотрим каждый из этих способов более подробно.

Вставка JavaScript кода ссылкой

По умолчанию в HTML использование гипертекстового перехода подразумевает открытие новой страницы или переход в другое место текущей страницы. При помощи JavaScript Вы можете менять поведение любого HTML элемента и гипертекстовый переход не является исключением. Для изменения стандартных событий обработки гипертекстовых переходов используется следующий код:

<A HREF="JavaScript:ТУТ_БУДЕТ_ВАШ_КОД">...</A>

Пока мы еще не изучили ни одной JavaScript команды, но ничего страшного здесь нет, ведь пока мы только приступили к изучению JavaScript основ и главное понять, как работает URL схема JavaScript.
 
Использование событий

Об использовании событий для вызова JavaScript кода мы упомянули в предыдущем уроке. Здесь нет ничего сложного. Берется любой HTML элемент и ему назначается событие, при выполнении которого выполняется JavaScript код. Создадим простой пример, который при наведении мыши на кнопку вызовет сообщение ПРИВЕТ, МИР.
 
<INPUT TYPE=button VALUE="Проведите по мне" onMouseOver="window.alert('HELLO, WORLD');">    

Как Вы и сами можете видеть ничего сложного здесь нет.

Подстановки

Подстановка является старым и мало используемым способом вызова JavaScript, поэтому останавливаться на нем подробно мы не будем. Разберем лишь наиболее важные моменты:

Для создания подстановки у атрибута элемента используется конструкция &{..}, которая дает браузеру понять что необходимо начать выполнять JavaScript инструкции. Все очень просто, но данный метод давно не используется ввиду появления гораздо более удобных и функциональных методов обработки кода.
 
Контейнер <SCRIPT></SCRIPT>

Использование контейнера <SCRIPT></SCRIPT> можно назвать более продвинутой версией обычной подстановки.

Использование этого контейнера позволяет JavaScript самому генерировать HTML код страницы. Идея состоит в том, что встретив контейнер <SCRIPT></SCRIPT> HTML обработчик передает управление JavaScript интерпритатору, который в свою очередь, переработав JavaScript код, дает на выходе HTML код, который начинает обрабатываться уже HTML обработчиком.

Немного замудренно, но на практике все очень даже просто.

Контейнер <SCRIPT></SCRIPT> может быть размещен либо внутри контейнера <HEAD></HEAD>, либо внутри <BODY></BODY>.

Ну и конечно же небольшой пример:
 
<HTML>
<HEAD>
<SCRIPT>
function greet()
{
window.alert('ПРИВЕТ');
}
</SCRIPT>
</HEAD>
<BODY>
<INPUT TYPE=button VALUE="Поприветствуем! " onClick=greet()>
</BODY>
</HTML>


 
Как и во всех предыдущих примерах все предельно просто. Вообще весь язык JavaScript не таит в себе особых трудностей, если конечно не копать очень уж глубоко) Но это нам и не понадобится.

Самым сложным в изучении этого языка на начальных этапах для меня лично оказалось использование не совсем привычной для языков программирования грамматики, например вызова встроенных событий, таких как onMouseOver.

Вся сложность состоит в том, что при любом другом написании этот обработчик не сможет быть интерпретирован (onmouseover, ONMOUSEOVER , onmouseOver, onMouseover). Ну об этом и о многом другом мы подробно поговорим в следующих уроках...

Комментарии в JavaScript

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

Для создания однострочного комментария используется // :
//Однострочный комментарий

И для создания многострочного комментария используется /* */:
/* Это
многострочный
комментарий */

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

В следующем уроке мы начнем вплотную работать с JavaScript и разберемся с основными типами данных.

Добавил: Админ-21NN | Просмотров: 15830 | Рейтинг: 5.0/2


Обратите Ваше внимание на другие статьи:

Уважаемые пользователи, пожалуйста, оставляйте комментарии! Нам очень важно Ваше мнение!
Всего комментариев: 0
Добавлять комментарии могут только зарегистрированные пользователи.

    
Меню пользователя
Аватар гостя

Приветствуем Вас, Гость

Логин:
Пароль:
Поиск по сайту
Поиск по названию
Поиск по тегам
Горячие темы форума
Зарабатываем деньги
Детская игра Подарки...
Тест скорости подклю...
кое что о Windows
Кто ты, человек?
Новая валюта портала
Все о сексе
"Что мешает нам...
Культура
Афоризмы
Лучшие 13 анекдотов ...
как защитить свой ко...
поговорим о софте
восстановление данны...
Я ненавижу Дом-2
Волга-Телеком
Кулинария "Кокт...
Стол заказов
Жалобы
С Днем Победы!!!
Прикольные картинки
С праздником Пасхи !...
Статистика
Новых за месяц: 146
Новых за неделю: 42
Новых вчера: 6
Новых сегодня: 3
Всего: 5292
Из них:
Администраторов: 3
$$$-Модераторов: 1
Модераторов: 3
Прокураторов: 3
-----------------
далее:
Проверенных: 247
Пользователей: 2884
Новичков: 1858
Заблокированных: 100
-----------------
Из всех пользователей:
Мужчин и парней: 4135
Женщин и девушек: 1156
Именинники
Поздравляем с Днем рожденья:

Dremvor(23), cooler999(29), пупсик(27), Андрей12345(28), rotwas(26), zai(48), lena_antoniva(30), Diman123(18), Irek_yo(18), hohar(58), qwert(40), Человек(20), olga6785(32), djamba(23), testament(30), Aliya_Bel(34), anrio(47), bloombooom(29)
Режим ON-LINE
Онлайн всего: 3
Гостей: 3
Пользователей: 0

Сейчас на портале:
Наша кнопочка
Нижегородский файловый портал

HTML-код кнопки:
Реклама
Размещение рекламы

Яндекс.Метрика
Регистрация сайта в каталогах, раскрутка и оптимизация сайта, контекстная реклама Ремонт холодильников в Нижнем Новгороде

Copyright © BankRemStroy © 2009-2017