Графический интерфейс JavaScript

Введение в HTML

Кликни меня

Создаем событие выполняемое при загрузке страницы

Связываем с этим событием дествие

Кликни меня

Создаем событие выполняемое при щелчке мышкой

Связываем с этим событием действие

Указываем объект по которому надо щелкать мышкой

ВВеди А=

Поясняющий текст

Создаем поле ввода

Значение отображаемое в поле ввода при загрузке страницы

Размер (длина) текстового поля в символах

Идентификатор поля ввода

ВВеди А=

Создаем кнопку

Надпись на кнопке

Связываем с кнопкой событие

Имя функции вызываемой при щелчке мышкой по кнопке

ВВеди А=



Результат=

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

Объявляем переменные

Преобразуем строку в число

Значение, записанное в первом окне ввода

Находим сумму

Значение суммы помещаем в третье окно вывода

Скрипт

Создание интерфейса

Выбери действие:
Сложить Вычесть Разделить Умножить

Тег SELECT служит для создания списка выбора (раскрывающегося списка), а также списка с одним или множественным выбором.

Идентификатор раскрывающегося списка

Значение каждой строки списка

Определяем какую строку списка выбрал пользователь

В зависимости от номера строки выполняем действие

Скрипт

Создание интерфейса

Сложить


Вычесть


Умножить


Разделить

Данные элементы используются для выбора одного или нескольких значений, отметив их флажками (галочками).

Создаем checkbox

Идентификатор checkbox

Надпись checkbox

Следующий checkbox с новой строки

Если в checkbox поставлена галочка

Скрипт

Создание интерфейса

Сложить

Вычесть

Умножить

Разделить

Переключатели используют, когда необходимо выбрать один единственный вариант из предложенных. Имя поля (параметр name) для всех элементов группы должно быть одинаковым.

Создаем переключатель

Имя для всех одно

Идентификатор переключателя

Установить точку при создании

Надпись за переключателем

Коллекция all представляет все элементы Web-страницы без исключений, в том числе и изображения. К элементам этой коллекции можно обращаться по номеру (нумеруются они в порядке появления в HTML-коде) или по имени.

Создаем массив переключателей

Проверяем какой переключатель включен

Скрипт

Создание интерфейса

22

Ячейка 4
Ячейка 5
Ячейка 6
Ячейка 7


Ячейка 8

Окончание таблицы:

Добавляем кнопку «Выход»

win = window.open(url, name, params)

function f5()
{
var thisWindow = window.open("",'_self');
var exit = confirm("Хотите закрыть страницу?");
if(exit){
thisWindow.close();
}

Выводит сообщение в окне с двумя кнопками: "ОК" и "ОТМЕНА". Возвращает true/false в зависимости от того, куда нажмет пользователь.

Получаем доступ к свойствам текущего окна

Закрываем текущее окно

function f1()
{
var newWin =
window.open("primer1.html",
"Site1","width=420,height=230,
resizable=yes,scrollbars=yes,
status=yes")

newWin.focus()
}

Открываемая страница

Ее имя

Свойства

Переводим фокус на новое окно

Список используемой литературы и интернет ресурсов: