- •Лекции по JavaScript Что такое javascript?
- •Среда разработки программ JavaScript
- •Что умеет javascript?
- •Переменные
- •Типы переменных
- •Массивы Создание
- •Аргументы
- •Описание, примеры
- •Методы объекта Array
- •Многомерные массивы
- •Объект Boolean
- •Объект Number
- •Объект Math
- •Объект String
- •Основы работы со строками
- •Использование кавычек
- •Встроенные функции
- •Строки и числа
- •Преобразование «Число → строка»
- •Преобразование «Строка → число»
- •Объект Date
- •Объект Global
- •Операторы и операции Операторы Javascript
- •Оператор break
- •Оператор comment
- •Оператор continue
- •Перебор свойств, кроме унаследованных
- •Оператор function
- •Оператор if...Else
- •Оператор return
- •Оператор var
- •Оператор while
- •Оператор with
- •Логические операторы
- •Операции сравнения
- •Арифметические операции
- •Битовые операции
- •Логические операции
- •Строковые операции
- •Операции присваивания
- •Прочие операции Условная операция
- •Операция запятая
- •Операция delete
- •Операция in
- •0 In langs // возвращает true
- •4 In langs // возвращает false Операция instanceof
- •Операция new
- •Операция this
- •Операция typeof
- •Операция void
- •Порядок выполнения операций
- •Функции
- •Функции - объекты
- •Области видимости
- •Параметры функции
- •Работа с неопределенным числом параметров
- •Пример передачи функции по ссылке
- •Пример использования:
- •Сворачивание параметров в объект
- •Объекты, свойства и методы Основные понятия
- •Объект JavaScript
- •Создание объектов с помощью инициализатора
- •Создание объектов с помощью конструктора
- •Создание методов
- •Изменение прототипа объекта
- •Удаление объектов
- •Вывод информации в строку состояния
- •Объект location
- •Проигрывание wav-файлов
- •Плавное изменение цвета фона документа html
- •Объект window.
- •Динамическое изменение страницы
- •Прокручивание документа
- •Параметры
- •Закрывающий тег
- •Аргументы
- •Значение по умолчанию
- •Параметр alt Описание
- •Значение по умолчанию
- •Параметр value Описание
- •Синтаксис
- •Параметры
- •Закрывающий тег
- •События
- •Когда использовать
- •Через свойство объекта
- •Основные события javascript
- •If (условие)
- •Способы открытия нового окна с помощью js
- •Модальное окно
- •X: 1, // добавляем свойство
- •Установка веб-сервера Apache и средств программирования под Windows
- •Что такое хостинг и где взять место под страницу.
- •Объектная Модель. Детали.
- •Языки на базе классов и языки на базе прототипов
- •Определение класса
- •Подклассы и наследование
- •Добавление и удаление свойств
- •Отличия. Резюме.
- •Пример Employee
- •Создание иерархии
- •Свойства объекта
- •Наследование свойств
- •Добавление свойств
- •Более гибкие конструкторы
- •И снова о наследовании свойств
- •Локальные и наследуемые значения
- •Определение взаимоотношений экземпляров
- •Глобальная информация в конструкторах
- •Нет множественного наследования
Удаление объектов
Мы можем удалить ранее созданный объект с помощью операции delete, например:
delete myBrowser;
Объектная модель Internet Explorer
Особенность работы сценариев JavaScript состоит в том, что результаты выполнения сценариев видны в браузере. Для работы с браузером JavaScript самостоятельно создает специальные объекты, которые называются объектами модели Internet Explorer (IE). В табл. перечислены основные объекты модели IE.
Основные объекты модели
Объект |
Описание |
window |
Объект самого верхнего уровня, представляющий собой сам Internet Explorer |
frame
|
фрейм. Все фреймы образуют семейство Frames |
history |
Предназначен для навигации по списку просмотренных в данном сеансе страниц |
navigator |
Предназначен для хранения информации о браузере |
location |
URL текущей страницы |
screen |
Представляет информацию об экране текущего пользователя |
script |
Хранит код сценариев данного окна |
event |
Предоставляет информацию, связанную с событием в сценарии |
parent |
Исходный объект window |
document |
Область, в которую сценарий выводит информацию |
link |
Вкладывается в объект document. Предназначен для хранения имеющихся в документе ссылок |
anchor |
Вкладывается в объект document. Предназначен для хранения имеющихся в документе ссылок, заданных тегом <А> |
form |
Вкладывается в объект document. Представляет собой форму |
element |
Вкладывается в объект form. Представляет собой элемент формы |
Каждый объект имеет свои свойства (поля) и методы. Если их изучить, то программирование на JavaScript не будет представлять никаких трудностей.
Объект window
Объект window представляет собой объект верхнего уровня иерархии. Он содержит четыре дочерних объекта:
document, frame, history, location.
Каждый из этих объектов имеет свои поля, методы и события.
При написании кода объект window подразумевается по умолчанию, поэтому ссылку на него можно опускать.
-
Событие
Момент генерации
onbeforeunload
Перед закрытием окна браузера
onblur
При потере окном фокуса
onerror
При ошибке
onfocus
При получении окном фокуса
onhelp
При нажатии клавиши <F1>
onload
При открытии окна браузера
onresize
При изменении размеров окна
onscroll
При прокручивании документа
onunload
При закрытии окна браузера
Методы объекта window
Метод |
Описание |
alert () |
Окно сообщения |
blur () |
Теряет фокус и генерирует событие onblur |
clear/Interval () |
Сбрасывает указанный таймер, установленный метода setlnterval () |
dearTimeout () |
Сбрасывает указанный таймер, установленный методе setTimeout() |
close() |
Закрывает окно |
confirm() |
Окно подтверждения |
execScript () |
Выполняет сценарий |
focus() |
Получает фокус и генерирует событие onfocus |
moveBy() |
Перемещает точку документа, отображаемую в верхнее левом углу окна, на указанное расстояние вдоль осей х и y |
moveTo ( ) |
Перемещает точку документа с указанными координатами в левый верхний угол окна |
navigate () |
Устанавливает URL-адрес |
open() |
Открывает новое окно |
prompt{) |
Окно с полем ввода |
resizeBy() |
Изменяет размеры окна на указанные величины |
resizeTo () |
Устанавливает заданные размеры окна |
scroll() |
Осуществляет прокрутку окна. Предпочтительнее использовать метод scrollTo() |
scrollBy() |
Вызывает прокрутку окна на указанные расстояния |
scrollTo() |
Осуществляет прокрутку окна |
setlnterval() |
Создает таймер, многократно выполняющий указанную функцию через заданный промежуток времени |
setTimeout() |
Создает таймер, однократно выполняющий указанную функцию спустя заданный промежуток времени |
showHelp() |
Показывает файл подсказки |
showModalDialog() |
Открывает модальное диалоговое окно |
//Пример
<html>
<head>
<title>Новое окно</title>
<script language=javascript>
//обратите внимание на перенос длинной строки
window.open('http://www.mgupi.ru','newwin','top=15, left=20,\ menubar=0, toolbar=0, location=0, directories=0, status=0,\ rollbars=0,resizable=0, width=400, height=300');
</script>
</head>
<body>
</body>
</html>
В JavaScript имеются два ключевых слова для ссылки на текущее окно - window и self. Поэтому, например, команду закрытия текущего окна можно реализовать двумя равносильными способами:
window.close();
self.close();
Свойство |
Описание |
clientInformation |
Возвращает браузер (объект navigator) |
closed |
Логическое свойство, которое указывает, закрыто ли окно |
defaultStatus |
Сообщение, выводимое по умолчанию в строке состояния |
dialogArguments |
Переменная или массив переменных, передаваемых модальному диалоговому окну |
dia1ogHeight |
Высота модального диалогового окна |
diailogLeft |
Абсцисса верхнего левого угла модального диалогового окна |
dialogTop |
Ордината верхнего левого угла модального диалогового окна |
dialogWidth |
Ширина модального диалогового окна |
document |
Объект document |
event |
Объект event |
history |
Объект history |
length |
Возвращает число фреймов (frames), отображаемых в данном окне |
location |
Объект location |
name |
Имя окна |
navigator |
Объект navigator |
offscreenBuffering |
Определяет, используется ли неотображаемый буфер |
opener |
Возвращает ссылку на окно, открывшее данное |
parent |
Возвращает ссылку на родительское окно |
returnValue |
Специфицирует возвращаемое значение из модального диалогового окна |
screen |
Окно screen |
self |
Текущее окно |
status |
Сообщение, отображаемое в строке состояния |
top |
Возвращает ссылку на самое верхнее родительское окно |
//Пример гиперссылка с закрытием окна
<html>
<head>
<title>Сумма</title>
<script type="text/javascript">
var sa = 100;
var sha = 1;
function summa (a,b)
{
var sum = a + b;
return(sum);
}
function wivodNaDispley()
{
document.write(summa(sa,sha));
}
</script>
</head>
<body>
<h3 align="center">
<a href="javascript:wivodNaDispley();">Вычислить</a></h3>
<h3 align="center"><a href="javascript:window.close();void(0);">Закрыть браузер</a></h3>
</body>
</html>