Скачать презентацию
Идет загрузка презентации. Пожалуйста, подождите
2
ВОПРОСЫ: 1. Язык JavaScript 2. Вставление скрипта в HTML-язык 3. JavaScript и Java 4. Элементы языка JAVASCRIPT 4.1. Функция alert 4.2. Переменные и константы 4.3. Описание переменных 4.4. Выражения 4.5. Команды 4.6. Комментарий 4.7. Вызов функции 4.8. Присваивание
3
1. Язык JavaScript JavaScript – это язык программирования, который понятен браузеру. Это означает, что браузер умеет выполнять (интерпретировать) команды этого языка. JavaScript – одно из тих средств, которые нужны для создания динамических страниц. Программу на JavaScript называют скриптом или сценарием, его можно помещать внутрь HTML-программы или держать в отдельном файле. Этот файл браузер прочитает (по специальной команде) во время интерпретации HTML-кода. Коды JavaScript дополняют коды HTML и «живут» вместе с ними. Даже если они расположены в отдельном файле. С JavaScript гипертексты получают новые возможности.
4
Скрипт размещается между двумя парными тегами.... Обычно запись скрипта выглядит так, как показано в листинге. 2. Вставление скрипта в HTML-язык Начало скрипта Скрипт представлен как HTML- комментарий, чтобы не «смущать» браузеры, которые о скриптах не знают Конец скрипта Блок - специально для браузеров, которые «не понимают скриптов» ... Код для браузеров, которые не поддерживают JavaScript...
6
Для возврата к основному тексту нажмите кнопку Назад на инструментальной панели браузера. Информационное окно alert Вид страницы браузере,который поддерживает скрипты после нажатия ОК
7
Скрипт в приведенном выше примере содержит всего одну команду на языке JavaScript – вызов функции alert. Функция alert создает информационное окно с единственной кнопкой ОК внутри. Пользователь читает сообщение, нажимает кнопку и окно убирается с экрана. Теперь браузер приступает к интерпретации команд, расположенных вслед за скриптом в HTML-коде – выводит в окошко текст, показанный на рис.
8
Если браузер не поддерживает JavaScript или эта поддержка отключена в настройках, в окно документа выводится сообщение, показанное ниже.
9
Если текст-аргумент функции alert слишком длинный, его можно записывать в нескольких строчках, используя знак «+» (операция соединения): alert("Язык JavaScript был разработан в 1995"+ "году фирмой Netscape для сл. версии браузера"); Результатом такой функции будет рисунок: Для записи длинной строки использована операция соединения
10
В случае необходимости для перевода строк в аргументе функции нужно использовать символы «\n»: alert("Первая строка.\n Строка вторая."}; Функция alert используется очень часто. Кроме простой задачи выдать пользователю сообщение, она часто используется как средство отладки.
11
За счет чего на гипертекстовой странице появляется динамика и интерактивность (взаимодействие с пользователем)? Браузер не просто показывает документ, он конст-руирует его объектную модель, а в дальнейшем следит за соответствием этой модели построенному изображению. Если что- то меняется в модели, это сразу отображается на экране. Окно браузера можно изменить двумя способами: · 1. написать HTML-теги и загрузить файл в браузер; · 2. воздействовать на объектную модель документа. Первый способ дает статичный гипертекстовый документ. Второй – позволяет менять уже построенное изображение. Можно воздействовать на объектную модель доку-мента через скрипты – программы на специаль-ных языках программирования (их должен «пони-мать» браузер).Самый распространенный язык для этого – JavaScript.Рассмотрим его.
12
3. JavaScript и Java JavaScript – это язык программирования, который разработан специально для работы совместно с HTML. Коды на JavaScript выполняются сразу браузером. С Web-программированием обычно связывают еще один язык – Java. JavaScript и Java – это совсем разные тихнологии и концепции. Объединяет их только похожий синтаксис языковых конструкций. Java – универсальный, частично компилируемый язык программирования общего назна-чения, который разработан с расчетом на мини-мальную зависимость от конкретного компьютера и конкретной ОС.
13
Java является частично компилируемым языком: текстовая программа сначала компилируется в бай-товый код, а затем байтовый код интерпретирует-ся. Такой миханизм позволяет существенно увеличить скорость работы приложения по сравнению с обычной интерпретацией. Java-программы, предназначенные для интер-претации браузером, называют апплетами. Апплет существенно отличается от скрипта по своему проявлению в гипертекстовом документе. Размещение апплета на странице подобно разме-щению картинок. Апплет занимает на экране от-дельную прямоугольную область и работает внут-ри нее самостоятельно, без явной связи с други-ми информационными элементами страницы.
14
Рассмотрим типичные задачи, которые решаются при помощи этих двух языков. JavaScript: Создание HTML-страницы «на лету», программным путем. Обработка простых диалоговых форм. Изменение внешнего вида страницы после ее вывода на экран. Java: Сложные формы с вводом/выводом графической информации. Анимация (настоящая анимация, а не анимированные GIF-файлы). Трихмерные изображения и их обработка. Выполнение самостоятельной графической прог-раммы в среде гипертекстового документа.
15
4. Элементы языка JAVASCRIPT 4.1. Функци я alert Она предназначена для создания информационного ок-на. Окно «всплывает» на экране и содержит информа-цию для пользователя. Единственная кнопка ОК поз-воляет убрать окно с экрана и разрешает браузеру продолжить построение документа. Аргументом функции alert может быть текстовая константа, она заключается в двойные или одинарные кавычки: alert("Офелия, о нимфа! Помяни грихи мои в молитвах."); alert('Птичка Божия не знает ни заботы, ни труда.'); Кроме того, аргументом функции alert может быть переменная и, в общем случае, любое выражение.
16
4.2. Переменные и константы В JavaScript нет описателей типа, подобных integer, Byte в языке Паскаль. Тип переменной определяется ее текущим значением и может меняться при выполнении программы много раз. Примеры: х = "3";// Сейчас переменная х строкового типа, //ее значение строка «3». х = 3; // Сейчас переменная х целого типа, //ее значение число 3. х="Оценка="+х; //Сейчас перем. х строкового типа, //ее значение строка «Оценка=3».
17
В JavaScript используются сл. виды констант: Целое число 255 десятичное целое восьмеричное целое (начинается с «0»). 0xFF шестнадцатеричное целое (начинается с «0 х»). Дробное (смешанное) число 3.14 обычная запись. 2.3 е 8 «инженерная» запись ( ). Строка "Привет!" 'Привет!' 'It\'s Ok!' для кавычек внутри строки используют указания \' и \". "\"ВАЗ 2104\"" "Первая строка.\n Строка втора я внутри записи можно использовать: \n перевод строки; Кинотеатр "Ударник" внутри одинарных кавычек можно "I'm programmer" использовать двойные без символа «\» и наоборот.
18
4.3. Описание переменных Переменная должна быть описана до ее использования. Для описаний берется ключевое слово var : var x; // Описание переменной с именем "х". var у=5; // Описание с присвоением числа. var mes="дядя Федор"; // Описание с присвоением строки. Для образования имен переменных используются идентификаторы. Идентификатор это последовательность из латинских букв и арабских цифр, которая начинается с буквы. В записи разрешается использовать символ подчеркивания «_» наравне с латинскими буквами. Регистр буквы в имени переменной имеет значение. Переменные с именами «Counter» и «counter» считаются разными.
19
4.4. Выражения Для арифметических операций используются следующие обозначения : Знак * / % Название Унарный минус Сложение Вычитание Умножение Деление Остаток от деления Пример -10 X+У Х-10 2* х У / 7 х % 3 Для строковых выражений используется операция соединения (конкатенации), обозначаемая знаком «+»: person="Крокодил" + " Гена"; Переменная person получает значение «Крокодил Гена» х = "2" + 1; Переменная х получает строковое значение «21».Когда операция «+» связывает строку с данными другого типа, результат преобразуется в строку.
20
4.5. Команды Команда завершается в JavaScript символом «;». Правила языка разрешают опускать этот знак в конце строки и перед закрывающей скобкой «}» Комментарий Наряду с уже известным строковым комментарием «//» можно использовать блоковый комментарий «/*... */» // Это строковый комментарий. /* А это блоковый комментарий. */
21
4.7. Вызов функции Пока была показана только функция alert: alert(выражение); Аргументом этой функции может быть выраже-ние, имеющее как текстовое, так и числовое значение. var ex1 = "Ищите"; var ex2 = "обрящете"; alert(ex1+ " и " + их 2);
22
var x = 48; var ex1 = "попугаев"; alert(x + " " + ex1); Результат выполнения скрипта показан на рис. var х = 2; var у = 3; alert("Результат умножения:" + х * у); Результат выполнения скрипта показан на рис.
23
4.8. Присваивание Наряду с привычным присваиванием вида «переменная=выражение», можно использовать следующие записи: Общий вид переменная переменная переменная переменная переменная += выражение переменная -= выражение переменная *= выражение переменная /= выражение переменная %= выражение Пример х х х х х += "кот" х-=2 х *= 10 х /= у + z х%=9 Что означает х = х + 1 х = х - 1 х = х + "кот" х = х - 2 х = х * 10 x = x / (y+z) х = х%9
24
Разница между командами + + х и х + + ( -- х и х -- ) проявляется тогда, когда они используются как составная часть других команд. В 1-случае (знаки перед именем) операция выполняется до использования переменной, а 2-ом – после. х = 5; – После выполнения этих команд: х и у у = ++ х; равны 6. х = 5; – После выполнения этих команд: х у = х ++; равно 6, а у равно 5.
Еще похожие презентации в нашем архиве:
