Создание функций в сценариях JavaScript Лабораторна робота № 3 JavaScript. Створення функцій. Відкривання нових вікон Мета: Закрепить изучение сценариев JavaScript, научиться создавать функции и открывать новые окна. Зміст: 1. Создание функций в сценарих JavaScript. 2. Открытие новых окон с помощью сценариев JavaScript. Література: 1. Рева О.Н. "JavaScript в кармане".: Эксмо, 2008. - 256c. 2. А.Ю.Гаевский, В.А.Романовский. "100% самоучитель по созданию Web-страниц и Web-сайтов: HTML и javascript".: Триумф, 2008. - 454c. Создание функций в сценариях JavaScript При создании переменной результату команды или события JavaScript присваивается имя. При создании функции делают почти то же самое, только имя присваивается целой серии команд. Множество команд JavaScript объединяются в одну. Сценарий состоит фактически из двух частей: собственно функции и команды onLoad, которая запускает функцию в работу. Вот обе части: <SCRIPT LANGUAGE="javascript"> <!-- Скрыть от браузеров, не поддерживающих JavaScript function dateinbar() { var d = new Date(); var y = d.getFullYear(); var da = d.getDate(); var m = d.getMonth() + 1; var t = da + '/' + m + '/' + y; document.write ("Вы прибыли на страницу " + t + "."); } // не скрывать --> </SCRIPT> ...и команда onLoad в <BODY>: <BODY BGCOLOR="хххххх" onLoad="dateinbar()"> Почти таким же сценарием мы пользовались для получения даты, поэтому он должен быть понятен. Здесь нас интересует реализация сценария. Разбор сценария Здесь мы видим новые элементы <!-- и -->. Возможно, они покажутся знакомыми. Эти знаки используются для комментариев в теле HTML: <!-- Это текст комментария, не видимый на странице --> Они присутствуют здесь, так как, хотите верьте, хотите нет, но все еще существуют браузеры, не поддерживающие JavaScript. Если браузер не поддерживает JavaScript, он воспринимает его как текст, который нужно вывести на странице. Выглядит это плохо. Но если воспользоваться этими командами комментария, то браузер успешно проигнорирует незнакомый текст и покажет страницу. Однако соблюдайте несколько правил. Команды комментария должны находиться между <SCRIPT> и </SCRIPT>. Если поставить их снаружи, то браузер посчитает комментарием весь сценарий JavaScript и ничего не будет выполнено. Текст после команды <!-- должен находиться на одной строке. Перед заключительной командой --> должна стоять двойная косая черта //, иначе JavaScript примет ее за часть сценария, что приведет к ошибке. Можно также добавить некоторый текст, так как он будет считаться комментарием. Совсем не обязательно писать текст к этим командам. Текст присутствует для того, чтобы проще было понять их назначение. Пользуйтесь приведенной выше схемой, и проблем не будет. Вернемся к разбору Здесь происходит две вещи. Сначала в первой части сценария создается функция. Потом команда, находящаяся внутри оператора HTML <BODY>, запускает работу функции. Давайте сначала разберем функцию. function dateinbar() { var d = new Date(); var y = d.getFullYear(); var da = d.getDate(); var m = d.getMonth() + 1; var t = da + '/' + m + '/' + y; defaultStatus = "Вы прибыли на страницу " + t + "."; } Схема довольно понятная. Вы пишете function и задаете любое имя, точно так же, как мы делали с переменными. Но обратите внимание, что после имени функции стоят круглые скобки, как после команды метода. То есть, при создании функции фактически создается новый метод для выполнения некоторой задачи. Так же, как и имена переменных, имена функций могут быть любой длины, не содержать пробелов и не совпадать с другим словом, уже используемым в языке JavaScript. Очень важно! При создании функции команды, которые составляют функцию, должны быть заключены в фигурные скобки {}. Видите, они стоят сразу после имени функции и в самом конце? Текст внутри фигурных скобок должен быть понятен. Такой же сценарий мы уже создавали: - создается переменная для года; - еще одна для числа; - еще одна для месяца; - затем четвертая для даты целиком; - выводится на странице. Команда "onLoad=" Мы задействуем новый обработчик событий. Команда onLoad ("при загрузке") (обратите внимание на заглавные буквы) говорит браузеру, что, загружая страницу, он должен выполнить предписанное далее. В данном случае следует функция dateinbar(). Эта команда почти всегда располагается в строке <BODY> документа HTML. И почти всегда за ней следует функция, но это необязательно. Можно с таким же успехом поместить туда и команду объект.метод. Расположение элементов. Это имеет не последнее значение. Вы знаете, что команда onLoad идет в строку BODY. Сценарий с функцией должен находиться в документе HTML между командами <HEAD> и </HEAD>. Хотя на самом деле его можно поместить где угодно, но если вы расположите его после команды onLoad, он заработает только после того, как загрузится вся страница. Если сценарий располагается перед командой onLoad, то он загружается в память компьютера раньше, и когда onLoad вызовет его, он будет готов к работе. Практически любой набор команд JavaScript можно записать в виде функции. Задание. Создайте функцию, которая создает два запроса (prompt). (Подсказка: один следует за другим с новой строки.) Первый предлагает пользователю ввести свое имя, второй — фамилию. Затем та же функция должна вызвать окно сообщения (alert) c текстом: Привет, "имя фамилия", добро пожаловать на "адрес страницы", мою замечательную страницу! |