4367

Скриптовой язык программирования JavaScript

Лекция

Информатика, кибернетика и программирование

Скриптовой язык программирования JavaScript Способы функционального применения скриптов 1) гипертекстовая ссылка (схема URL) 2) обработчик события (handler) 3) вставка (элемент SCRIPT). Гипертекстовая ссылка. Применяется в следующих элементах: А...

Русский

2012-11-18

43.5 KB

13 чел.

Скриптовой язык программирования JavaScript

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

1) гипертекстовая ссылка (схема URL);

2) обработчик события (handler);

3) вставка (элемент SCRIPT).

Гипертекстовая ссылка. Применяется в следующих элементах: А (атрибут HREF); IMG (атрибут SRC); FORM (атрибут ACTION).

Вместо URL указывается строчка: JavaScript:КОД_ПРОГРАММЫ

<A HREF="JavaScript:alert('Вы нажали на ссылку')">Ссылка</a>

<FORM ACTION="JavaScript:alert('Подтверждение формы');">

<INPUT TYPE=SUBMIT VALUE="Submit"></FORM>

Обработчик события.

JavaScript-код указывается в качестве значения соответствующего атрибута элемента: OnСОБЫТИЕ=«КОД_ПРОГРАММЫ»

<DIV OnMouseOver="alert('ничего нет')">Здесь ничего нет</DIV>

Вставка.

JavaScript-код помещается в элементе SCRIPT. Обычно в заголовке документа HEAD размещают объявления переменных и функций, а в основной части документа – код, который участвует в генерации HTML-страницы

<SCRIPT LANGUAGE="JavaScript">alert('вставка');</SCRIPT>

Обращение к объектам осуществляется в соответствии со структурой объектной модели документа:

ОБЪЕКТ_1.ОБЪЕКТ_2. … .ОБЪЕКТ_N

ОБЪЕКТ_1.ОБЪЕКТ_2. … .ОБЪЕКТ_N.СВОЙСТВО1. …. СВОЙСТВОM

ОБЪЕКТ_1.ОБЪЕКТ_2. … .ОБЪЕКТ_N.МЕТОД

<FORM NAME="Fm1"><INPUT NAME="Txt1" SIZE=30></FORM>

 Обращение к объекту:

window.document.forms[0].elements[0]

document.forms[0].elements[0]

document.Fm1.Txt1

Fm1.Txt1

 Обращение к свойству объекта:

Fm1.Txt1.style.backgroundColor='red';

document.images[0].style.display='none';

Обращение к методу объекта:

Fm1.Txt1.click(); (НЕВЕРНО: Fm1.Txt1.Click();)

Fm1.submit();

Обращение к объектам по идентификационному имени

<div id=n1>Текст</div>

Обращение к объекту:

document.getElementById("n1")

 Обращение к свойствам объекта:

document.getElementById("n1").style.backgroundColor='red';

//изменение цвета фона

document.getElementById("n1").style.display='none';

//изменение видимости объекта

document.getElementById("n1").innerHTML='Другой текст';

//изменение HTML-кода, содержащегося в объекте

Типы и структуры данных

-литералы и переменные;

-массивы, функции и объекты.

Литералы

числовой литерал: 42

числовой литерал: 1.432

числовой литерал: 1.432e+2

строковый литерал: 'Это строковый литерал'

строковый литерал: "Это строковый литерал"

Переменные

Определяются при помощи оператора var

var i;

var i=20;

var w=window.open();

Регистр букв имеет значение. Тип переменной определяется контекстом.Узнать тип переменной можно с помощью функции typeof(ИМЯ_ПЕРЕМЕННОЙ). Результат функции – строка 'number', 'string' или 'object'.

alert(typeof(i));

Можно сразу задать переменную без оператора var:

i=10;

При определении переменной оператором var ей присваивается значение null:

var i;

if (i==null) { alert('i is null'); } //сообщение появится

i='';

if (i==null) { alert('i is null'); } //сообщение не появится

i=null;

if (i==null) { alert('i is null'); } //сообщение появится

Массивы

Массивы бывают встроенные (document.images[]) и определенные пользователем.

var a = new Array(); //объявление массива

var b = new Array(10); //объявление массива со значениями

var c = new Array(12.32, "какая-то строчка");

alert(c[1]); //появится сообщение "какая-то строчка", нумерация от 0

c[10]='новая строчка';

alert(c.length); //определение количества элементов (11)

Функции

function f_name(arg1,arg2,...)

{

/* function body */

return result;

}

function add(a, b) {

return a+b;

 }

alert(add(10,20)); //появится сообщение «30»

Оператор условия if

if (логическое выражение) оператор1;

[else оператор2;]

if (i==null) { alert('i is null'); } else { alert('i is not null'); }

Оператор цикла while

while (логическое выражение) оператор;

var i=1;

while (i<10) { alert(i); i+=2; }

Оператор цикла for

for (инициализация переменных цикла; условие; модификация переменных цикла)

оператор;

for (var i=0; i<10; i++) { alert(i); }

Определение всех свойств объекта

for(v in ОБЪЕКТ)

{ document.write(v+" : "+typeof(v)+" : "+eval("ОБЪЕКТ."+v)+"<br>"); }

На экране для каждого свойства будет выведено его тип и значение.

eval(строчка) – аргумент выполняется как код программы;

eval('ale'+'rt("'+'eval'+'");'); //появится сообщение «eval»

Функции для работы с таймером

ПЕРЕМЕННАЯ=setTimeout('КОД_ПРОГРАММЫ', ВРЕМЯ);

Код программы выполнится через указанное время (в милисекундах).

var t=setTimeout('alert("Таймер")', 1000);

Через 1 секунду появится сообщение «Таймер»

Сброс таймера по имени переменной:

clearTimeout(ПЕРЕМЕННАЯ);

setInterval('КОД_ПРОГРАММЫ', ВРЕМЯ);

Код программы будет выполняться периодически с указанным интервалом (в милисекундах).

setInterval('alert("Таймер")', 1000);

Через каждую секунду будет появляться сообщение «Таймер»

Работа с графическими изображениями

document.images[0] – первая картинка документа

document.images[0].src='http://aics.ru/img/logo.gif'; - изменение картинки

var img1=new Image; - создание нового объекта-картинки

img1.src='http://aics.ru/img/logo.gif'; - загрузка картинки


 

А также другие работы, которые могут Вас заинтересовать

545. Блок-секция торцевая, правая 9 – этажная 27 квартирная 77.5 KB
  По функциональному признаку жилые здания делятся на дома квартирного типа, общежития, интернаты. Они составляют более 85% общего объема строительства общественных зданий. Секционное многоэтажное здание, предназначенное для длительного проживания.
546. Исследование работы метода наименьших квадратов в математическом пакете MathLab 101.5 KB
  Познакомиться с средствами MathLab и смоделировать работу метода наименьших квадратов для полиномиальной модели для объекта с высоким уровнем помехи. Метод наименьших квадратов обеспечивает быстрый и точный подбор коэффициентов модели на базе выборки входов и выходов объекта.
547. Переваги та недоліки енергозберігаючих ламп 80.5 KB
  Сформувати в учнів поняття про енергозбереження та енергоефективність. Заборона на виробництво найпопулярніших в усьому світі ламп розжарювання потужністю від 100 Вт і більше набула чинності.
548. Циркові династії України. Сенсація на манежі 94.5 KB
  Створений подружжям Шевченко атракціон з дресированими хижаками викликає незмінний інтерес глядачів і у нас в країні і за кордоном, за творчі успіхи і величезний внесок у розвиток циркового мистецтва артисти були удостоєні почесних звань народних артистів.
549. Резидуально-органические поражения ЦНС 111 KB
  Последствия раннего резидуально-органического поражения ЦНС с церебрастеническим, неврозоподобным, психопатоподобным синдромами. Органический психический инфантилизм. Синдром детской гиперактивности с дефицитом внимания. Механизмы социальной и школьной дизадаптации, профилактика и коррекция при остаточных явлениях резидуально-органической церебральной недостаточности и при синдроме детской гиперактивности.
550. Административная ответственность в области предпринимательской деятельности 107.21 KB
  Административное правонарушение как основание административной ответственности. Производство по делам об административных правонарушениях в сфере предпринимательской деятельности. Материально-правовые и процессуальные особенности производства по делам об административных правонарушениях в сфере предпринимательской деятельности.
551. Различай ж–з. Антонимы 81.5 KB
  Конспект логопедического занятия с группой учащихся 3 класса, имеющих диагноз: нарушение чтения и письма, обусловленные ОНР (3 уровня).
552. Линейная алгебра. Нахождение собственного значения и вектора матрицы 84 KB
  Нахождение собственного значения и вектора матрицы. Поиск вектора между углами, вычисление обратных и решение матричных уравнений.
553. Истечение жидкости через отверстия и насадки 58 KB
  Произвести визуальное наблюдение за особенностями истечения жидкости через круглое отверстие с острой кромкой, квадратное отверстие и внешний цилиндрический насадок. Определить опытные значения коэффициентов скорости, расхода и гидравлического сопротивления для отверстия и насадка.