Опубликован: 01.08.2012 | Уровень: для всех | Доступ: платный | ВУЗ: Томский политехнический университет
Лекция 11:

JavaScript. Общие сведения

< Лекция 10 || Лекция 11: 12 || Лекция 12 >

Возможности и ограничения JavaScript

Подведем итог всему вышесказанному и сформулируем список основных возможностей JavaScript. JavaScript позволяет:

  • добавлять различные эффекты анимации элементам веб–страницы;
  • реализовывать поведение веб–страницы в ответ на события (перемещение указателя мыши, нажатие клавиш с клавиатуры и т.д.);
  • осуществлять проверку ввода данных в поля формы до отправки на сервер, как следствие снижение нагрузки на сервер;
  • извлекать данные о компьютере посетителя (посредством cookie - файлов);
  • определять тип пользовательского браузера и, соответственно, загружать веб – страницу, ориентированную на данный браузер;
  • изменять содержимое html-элементов, добавлять новые теги, изменять стили.

Существуют также и ряд ограничений:

  • нельзя закрыть окна и вкладки открытые без использования JavaScript;
  • нет защиты исходного кода страницы;
  • нельзя запретить копирование текста или изображений со страницы;
  • нельзя получить доступ к веб-страницам, расположенным на другом домене;
  • нет доступа к файлам, расположенным на компьютере пользователя (вообще нет доступа куда – либо за пределами веб - страницы).

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

Связь с HTML – документом

Как и в случае с CSS, JavaScript – код может быть размещен как в рамке самой веб–страницы, так и за ее пределами, в качестве отдельного файла. Предпочтительнее с точки зрения Web 2.0, безусловно, является второй вариант. Для подключения JavaScript используется парный тег <script>.

Всего существует три способа подключения JavaScript:

Подключение в любом месте:

<html>
  <body>  
    <script type="text/javascript">
      for(var i=0; i<5; i++)
      {
        alert("Номер входа в цикл:"+i)
      }
    </script>
  </body>
</html>

Когда браузер открывает HTML-страничку, он первым делом читает и выполняет то, что находится в теге <script> ;</script>, потом продолжает читать страницу дальше.

Атрибут type говорит о том, что это javascript. Вообще говоря, атрибут может отсутствовать - разницы нет, но с точки зрения стандарта его следует указать.

Вынос скриптов в заголовок

<html>
  <head>
    <script type="text/javascript">
      function start_example()
      {
        for(var i=1; i<5; i++)
        {
     	  alert("Номер входа в цикл:"+i)
        }
      }
    </script>
  </head>
  <body>
    <input type="button" onclick="start_example()" 
           value="Запустить цикл"/>
  </body>
</html>

В данном примере, код javascript, размещен внутри тега <head> </head>.

Внешние скрипты

Обычно javascript-код вообще не пишут в HTML, а подключают отдельный файл со скриптом:

<script type="text/javascript"  src="/myscript.js"/>

При этом файл /myscript.js содержит javascript-код, который иначе мог бы находиться внутри тега <script>.

Для подключения более одного скрипта, используется несколько тегов::

<script type="text/javascript" src="/js/script1.js"/>
<script type="text/javascript" src="/js/script2.js"/>
...

При указании атрибута src содержимое тега игнорируется.

Одновременно подключить внешний файл и написать что-то внутри тега нельзя. Придется делать два разных тега <script>: первый с src, второй - с командами, которые будут выполнены после выполнения внешнего файла.

Ключевые термины и определения

Веб – сценарии – программный код на интерпретируемом языке, внедренный в веб – страницу.

Cookie файлы - текстовые файлы, хранящие информацию, которую передает веб – сайт браузеру пользователя.

Интерпретируемый язык программирования - язык программирования, в котором исходный код программы не преобразовывается в машинный код для непосредственного выполнения центральным процессором (как в компилируемых языках), а исполняется с помощью специальной программы-интерпретатора.

Краткие итоги

Нами были рассмотрены основы использования веб – сценариев, их возможности и ограничения. Современная веб – разработка также не обходится без применения JavaScript, как и без CSS.

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

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

Список материалов для самостоятельного изучения

  1. http://csstips.net/html-css-javascript/
  2. http://www.woodger.ca/js_orig.htm
  3. http://www.po4emu.ru/drugoe/history/index/tehnika/stat_tehnika/4.htm
  4. http://habrahabr.ru/post/106274/
  5. http://oooportal.ru/?cat=article&id=1043
< Лекция 10 || Лекция 11: 12 || Лекция 12 >
Сергей Крупко
Сергей Крупко

Добрый день.

Я сейчас прохожу курс  повышения квалификации  - "Профессиональное веб-программирование". Мне нужно получить диплом по этому курсу. Я так полагаю нужно его оплатить чтобы получить диплом о повышении квалификации. Как мне оплатить этот курс?

 

Галина Башкирова
Галина Башкирова

Здравствуйте, недавно закончила курс по проф веб программиованию, мне прислали методические указания с примерами тем, однако темы там для специальности 

Системный администратор информационно-коммуникационных» систем.
Мне нужно самой найти тему? или делать по высланным темам

 

Мария Кравцова
Мария Кравцова
Россия, Сочи, РГПУ им. А.И.Герцена, 1997
Екатерина Архангельская
Екатерина Архангельская
Россия, СПбГУАП