Отправляет email-рассылки с помощью сервиса Sendsay
  Все выпуски  

JavaScript для начинающих. Изучаем с нуля. JavaScript и фильм. Один принцип – одна судьба!


Рассылка "JavaScript для начинающих. Изучаем с нуля"

"Подключайтесь к..."

Профессиональный Центр Обслуживания Партнеров Яндекса Profit-project объявляет о бесплатных консультациях о повышении CTR объявлений от Яндекс.Директ на вашем сайте.

Подключайтесь к Profit-project, размещайте контекстную рекламу от Яндекса на своем сайте и зарабатывайте вместе с Яндексом.

Profit-project - профессиональный ЦОП Яндекса для вебмастеров. 24х7 дружественный сапорт, быстрые выплаты, подарочные домены RU, хостинг и консультации для вебмастеров.


JavaScript и фильм. Один принцип – одна судьба!

Как вы уже знаете, HTML - это язык разметки документов, с помощью которого создаются вэб-страницы. Чтобы напомнить вам, что из себя представляет код документа HTML я приведу небольшой пример:

<HTML>
<HEAD>
<TITLE>Заголовок документа<TITLE>
</HEAD>
<BODY>
<H1>Птицефабрика по разведению страусов</H1>
<P>Добро пожаловать на наш сайт. Он еще не создан</P>
</BODY>
</HTML>

Этот документ состоит из заголовка, обозначенного тэгами элемента HEAD, и тела, обозначенного тегами BODY. Для того, чтобы добавить сценарий JavaScript на вэб-страницу, используется пара дескрипторов <SCRIPT> и </SCRIPT>.

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

Рассмотрим небольшой пример:

<HTML>
<HEAD>
<TITLE>Заголовок документа<TITLE>
</HEAD>
<BODY>
<H1>Птицефабрика по разведению страусов</H1>
<P>Добро пожаловать
на наш сайт. Он еще не создан</P>
<SCRIPT LANGUAGE="JavaScript">
document.write(document.lastModified);
</SCRIPT>
</BODY>
</HTML>

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

Заметьте, что дескриптор <SCRIPT> содержит параметр LANGUAGE="JavaScript". Этот параметр определяет используемый язык подготовки сценария. В нем вы можете также указывать и номер версии языка.

В приведенном примере сценарий размещается в теле HTML-документа. Сценарии могут размещаться в четырех различных частях документа HTML.

  • В теле документа. В этом случае результат сценария отображается на вэб-странице при ее загрузке в браузере.
  • В заголовке документа между парой тегов HEAD. сценарий, размещенный в заголовке, не выполняется сразу при загрузке страницы, а используется другими сценариями. В этом случае он используется как функция - группа операторов JavaScript, выполняемых как одно целое.
  • В теге HTML. Такая конструкция называется обработчиком событий и позволяет выполнять сценарий вместе с тегом. Обработчик событий представляем собой отдельный тип сценария, который не требует использования дескриптора <SCRIPT> для его обозначения.
  • В отдельном файле. JavaScript позволяет создавать собственные файлы с расширением .js, содержащие готовые сценарии. В этом случае сценарий указывается в коде документа в виде имени файла, приведенного между дескрипторами <SCRIPT>

Итак, JavaScript - это язык подготовки сценариев для вэб-документов. Команды JavaScript вставляются напрямую в документ HTML, и сценарий выполняется непосредственно при загрузке его в браузере.

Инструменты создания сценариев

Вам нет необходимости приобретать специальное программное обеспечение для создания сценариев JavaScript. Все что для этого необходимо - это текстовый редактор. Подойдет любой, если вы еще не определились, пользуйтесь БЛОКНОТОМ, который входит в состав Windows.

Отсчет времени

Одно из привычных использований JavaScript - это отображение даты и времени. Поскольку сценарий JavaScript выполняется в браузере, необходимо время отображать в соответствии с временным поясом места жительства пользователя. Для начала создадим сценарий вычисления всеобщего скоординированного времени. (Всеобщее скоординированное время соответствует времени нулевого меридиана или времени по Гринвичу. Это время абсолютного уровня отсчета дат.)

Начало сценария

Наш сценарий, как и большинство других программ JavaScript, начнем с дескриптора <SCRIPT>.

Откройте текстовый редактор (БЛОКНОТ) и введите пару дескрипторов <SCRIPT>:

<SCRIPT LANGUAGE="JavaScript">
</SCRIPT>

Добавление операторов JavaScript

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

Сохранение данных в переменных

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

После дескриптора <SCRIPT> введите приведенные ниже строки. Обратите внимание на использование строчных и прописных букв - JavaScript не только их различает, но и использует по-разному:

now = new Date();

Этот оператор создает переменную now, которая принимает значение текущей даты. Этот оператор и другие, используемые в сценарии, построены на основе объекта Data, необходимого для задания дат.

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

Вычисление значения

JavaScript определяет дату, как количество миллисекунд, отсчитанных от 1 января 1970 года. Но это не значит, что вам нужно в ручную высчитывать и переводить время, для этого есть встроенные функции.

Чтобы завершить сценарий, перед закрывающим дескриптором </SCRIPT> введите следующие две строки:

localtime=now.toString();
utctime=now.toGMTString();

Эти операторы создают две новые переменные: localtime и utctime. Первая содержит текущее время и дату, а вторая - их абсолютные значения.

В конечном счете обе переменные содержат текстовые значения. Например, January 25, 2004 12:00 PM. Выражаясь языком программистов, сохраненный в переменной текст называется строкой. Детально о строках поговорим позже.

Вывод результата на экран

Теперь, когда есть две переменные, принимающие требуемое значение в секундах, самое время побеспокоиться о выводе результата на экран. В JavaScript существует несколько способов отображения данных на экране. Один из самых простых заключается в применении оператора document.write.

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

document.write("<b>Текущее время: </b>" + localtime + "<BR>");
document.write("<b>Абсолютное время: </b>" + utctime + "</p>");

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

Вставка сценария на вэб-страницу

Теперь есть готовый сценарий, готовый для вставки на вэб-страницу. Сначала проверьте код сценария, он должен быть таким:

<SCRIPT LANGUAGE="JavaScript">
now = new Date();
localtime=now.toString();
utctime=now.toGMTString();
document.write("<b>Текущее время: </b>" + localtime + "<BR>");
document.write("<b>Абсолютное время: </b>" + utctime + "</p>");
</SCRIPT>

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

<HTML>
<HEAD><TITLE>Отображение даты</TITLE>
<BODY>
<H1>Текущее время</H1>
<p>
<SCRIPT LANGUAGE="JavaScript">
now = new Date();
localtime=now.toString();
utctime=now.toGMTString();
document.write("<b>Текущее время: </b>" + localtime + "<BR>");
document.write("<b>Абсолютное время: </b>" + utctime + "</p>");
</SCRIPT>
</BODY>
</HTML>

Вот вы и получили документ HTML со сценарием JavaScript. Сохраните его с расширением .html или .htm.

 

================

Фоменко Алексей. Руководитель проекта Sitesozdat.comСвой сайт собственными силами для каждого желающего.

«Хотите узнать больше о создании сайта? Тогда подписывайтесь на аудио-курс О создании сайта

 

"Подключайтесь к..."

Профессиональный Центр Обслуживания Партнеров Яндекса Profit-project объявляет о бесплатных консультациях о повышении CTR объявлений от Яндекс.Директ на вашем сайте.

Подключайтесь к Profit-project, размещайте контекстную рекламу от Яндекса на своем сайте и зарабатывайте вместе с Яндексом.

Profit-project - профессиональный ЦОП Яндекса для вебмастеров. 24х7 дружественный сапорт, быстрые выплаты, подарочные домены RU, хостинг и консультации для вебмастеров.
О создании сайта в том числе и с помощью скриптов javascript || Javascript || Скачать скрипты javascript

В избранное