Практикум по программированию на JavaScript. Сценарий document.write (" Это красный текст ") Результат работы сценария Это красный текст С помощью DOCUMENT.

Презентация:



Advertisements
Похожие презентации
Ключевая тема этого задания ЕГЭ – использование вложенных условных операторов, причем в тексте задания фрагмент программы обычно записан без отступов «лесенкой»
Advertisements

JavaScript Лекция 8. JavaScript JavaScript - новый язык для составления скриптов, разработанный фирмой Netscape. С помощью JavaScript можно легко создавать.
Введение в Java Script УРОК 1. Пример ПЕРВЫЙ Открыть программу блокнот и записать следующую команду: Сохранить файл С расширением JS загрузить файл Двойным.
Программирование на Паскале – первый уровень Простые (линейные) программы. Операторы ввода-вывода. Переменные величины. Учитель информатики МОУ Юрцовская.
Powerpoint Templates Page 1 Язык разметки гипертекста HTML.
Структура HTML- документа. Терминология Элемент - конструкция языка HTML. Это контейнер, содержащий данные и позволяющий отформатировать из определенным.
Теперь, когда вы постигли азы программирования, будем учиться писать программы, которые позволяют вести диалог между компьютером и человеком (пользователем).
Автор – Богачёва Г. В. Учитель информатики Лицей 144 Санкт - Петербурга Решение задач С 1 части С Единого государственного экзамена.
Тема урока: «Язык разметки гипертекста HTML». HTML Hyper Text Markup Language – язык гипертекстовой разметки. Описательный язык разметки HTML имеет свои.
Программирование в Mozilla По материалам сайта. Добавление Javascript в XUL-страницы Добавление страниц с текстом на Javascript происходит точно так же,
1 2 Программное окно WORD Кнопки управления окном текущего документа Кнопки управления окном текущего документа Кнопки управления программным окном WORD.
1 Учебный курс Введение в JavaScript и CGI Лекция 1 Введение в JavaScript кандидат технических наук Павел Брониславович Храмцов
Понятие переменной Переменная – это величина, которая изменяется в процессе работы программы. Для описания переменной следует указать имя переменной,
Ссылки Теоретический материал к модулю 13. Ссылка в электронном документе - какой-либо объект, нажав на который можно перейти к другому объекту. MS Word.
Гипертекстовые ссылки в тексте. Гиперссылка Гиперссылка часть гипертекстового документа, ссылающаяся на другой элемент (команда, текст, заголовок, примечание,
Циклы в C++. Иногда необходимо повторять одно и то же действие несколько раз подряд. Для этого используют циклы. В этом уроке мы научимся программировать.
Ввод данных – чисел, текстов, формул в ячейки таблицы. Ввод данных: Выделить ячейку; Установить курсор в поле Строки формул; Набрать данные с клавиатуры.
2 Программное окно WORD Кнопки управления окном текущего документа Кнопки управления окном текущего документа Кнопки управления программным окном WORD.
Презентация на тему: «Программирование Разветвляющихся структур». Составила: учитель информатики Чура Н.А. 1.
Ссылки на ячейки и их использование j нажмите клавишу F5 или выберите пункт Показ слайдов > С начала, чтобы начать курс. На панели сообщений нажмите Разрешить.
Транксрипт:

Практикум по программированию на JavaScript

Сценарий document.write (" Это красный текст ") Результат работы сценария Это красный текст С помощью DOCUMENT объявляется документ (документ HTML). Этот документ будет изменен в нем что-то будет написано ( WRITE ). То, что будет написано, находится внутри скобок. DOCUMENT представляет собой объект. Слово WRITE (писать), отделенное точкой, называется методом объекта. Обратите внимание, что текст внутри скобок находится в кавычках. В HTML эти кавычки не требуются. Задание Измените сценарий так, чтобы выводились две строки текста, красная и синяя. Но это надо сделать с помощью дополнительных команд JavaScript, а не просто добавить код HTML к приведенному примеру. На странице должно выводиться следующее: Это красный текст Это синий текст

ОШИБКИ Ошибки бывают двух типов: Ошибка синтаксиса означает опечатку или неправильную конфигурацию JavaScript. Ошибка времени выполнения означает, что была использована неправильная команда. Задание Ниже показан сценарий с ошибкой. Загружая страницу с этим сценарием, браузер должен выдать два сообщения об ошибке. Исправьте их. Некоторые команды покажутся незнакомыми, но это неважно. Сообщения содержат достаточно информации, чтобы исправить сценарий. Если сценарий выполнится правильно, то на странице появится текущая дата. Подсказка: возможно, сначала будет получено только одно сообщение. Вторая ошибка появится, когда будет исправлена первая. Код с ошибкой...x dothis = new Date() month = dothis.getMonth() month = (month * 1) + 1 day = dothis.getDate() year = dothis.getFullYear() document.wrte(" ",month,"/",day,"/",year," ")

Метод get Что-либо(): getDay(), getDate(), getMonth(), getYear(), getH ours(),getMinutes(), и getSeconds() (получить День, Число, Месяц, Год, Час, Минуту, Секунду) !!!! Методы без объектов не используются //Сценарий выводит точную дату и время посещения страницы Now = new Date(); document.write("Сегодня " + Now.getDate()+ "-" + (Now.getMonth()+1) + "-" + Now.getFullYear() + ". Вы зашли на Web-страницу ровно в: " + Now.getHours() + ":" + Now.getMinutes() + " и " + Now.getSeconds() + " секунд.") !!!! Строка document.write не должна прерываться. Результат работы сценария Сегодня Вы зашли на эту Web-страницу ровно в: 8:42 и 3 секунд.

//Сценарий выведет на странице номер месяца Now = new Date(); document.write("Сейчас месяц " + (Now.getMonth()+1)) document.write("Сегодня " + (Now.getMonth()+1)+ "-" + Now.getDate() + "-" + Now.getFullYear() + ". Вы зашли на Web- страницу ровно в : " + Now.getHours() + ":" + Now.getMinutes() + " и " + Now.getSeconds() + " секунд") RightNow = new Date(); var mpo = RightNow.getMonth(); var mpo1 = mpo + 1; document.write("Сегодня месяц " +mpo1+ "."); Вот что получилось: Cегодня месяц 8. Задание Напишите сценарий, который выводит на Web-странице дату, разделенную косой чертой. Приветственный текст должен быть зеленого цвета. Числа могут быть не зеленого цвета. Добавьте также комментарий о том, что это вы написали этот сценарий. Возможное решение Привет! Сегодня у нас 18/8/2006. Вот сценарий: // Автор сценария Now = new Date(); var mpo = Now.getMonth(); var mpo1 = mpo + 1; document.write(" Привет! Сегодня у нас: " + Now.getDate() + "/" + mpo1 + "/" + Now.getFullYear() + ".");

Обработчики событий: onMouseOver Сценарий Ссылка Щелкните здесь Результат работы сценария При наведении курсора мыши на ссылку строка состояния в окне браузера изменится. onMouseOver - обработчик событий (Event Handler) гипертекстовой ссылки. Используется внутри гиперссылки. Формат гипертекстовой ссылки остается без изменений. Обработчик событий onMouseOver ставится сразу же после адресаURL. Событие (Event) приводится в действие, когда браузер распознает onMouseOver="". Общая схема : два элемента, разделенные точкой. До сих пор это означало, что один является объектом, а другой методом. Но в данном случае объектом является window (окно), оно существует; status(статус) представляет собой свойство (property) oкна. Это небольшой участок окна, где должен разместиться следующий далее в команде текст. Это проще запомнить, если представить, что метод обычно выражается глаголом, как write (писать) или get (получить). Свойство выражается существительным и существует как небольшая часть элемента, стоящего перед точкой. Если у window есть изменяемое свойство status, значит, можно изменить и другие свойства окна. После window.status ставится знак равенства =, за которым следует то, что должно произойти. В данном случае это текст в одинарных кавычках. Он появится в строке состояния, когда вы наведете курсор на гипертекстовую ссылку. Пожалуйста, обратите еще раз внимание на точку с запятой в конце командной строки. Затем следует return true. Эти два слова имеют вполне определенное влияние на то, что произойдет, когда указатель мыши переместится на ссылку. Если они присутствуют, сценарий проверит, есть ли строка состояния. Если проверка будет успешной ( true ), происходит событие. Обратите внимание, что когда указатель мыши перемещается на ссылку, то текст в строке состояния блокируется. Он больше не изменяется при последующих перемещениях указателя мыши на ссылку. (Если обновить страницу, то можно будет это увидеть). Если проверка строки состояния отсутствует, то выполняется действие по умолчанию. По умолчанию в HTML выводится URL- ссылка, на которую указывает курсор мыши. Затем, когда курсор смещается со ссылки, произойдет событие. И так как проверка отсутствует, то событие будет происходить всякий раз при перемещении курсора мыши над ссылкой.

В HTML цветом фона страницы управляет команда BGCOLOR. То же самое и здесь, только обязательно соблюдайте регистр символов. В JavaScript цвет фона обозначается bgColor. Подумаем, как создать ссылку, которая изменяла бы цвет фона окна с помощью события onMouseOver. 1.Во-первых, раз это ссылка, то сохраним тот же формат, который использовался ранее. 2. Что изменяется, окно или документ? Куда идет команда bgColor, когда создается Web-страница? В документ. Значит, это и есть нужный объект. Заменим window на document. 3. Мы собираемся изменить фоновый цвет объекта, потому заменим status на bgColor. 4. Появление текста нам больше не нужно, поэтому заменим его цветом. Возьмем розовый ( pink ). 5. Нам нужно, чтобы новый цвет оставался независимо от того, сколько раз мы будем наводить курсор на ссылку, потому вставляем return true после точки с запятой. Вот что получилось... Щелкните здесь Если требуется и то, и другое Подумаем, как можно это сделать. Здравый смысл подсказывает, что нужно написать две команды onMouseOver. Попробуем это реализовать. Эти две команды не разделяются. Мы хотим, чтобы они произошли одновременно, поэтому не будем разделять команды точкой с запятой, так как точка с запятой означает конец оператора. Новое правило: ставьте запятую, чтобы отделить друг от друга несколько событий JavaScript.