JavaScript.1 2012. Объекты языка и браузера Интерактивный интерфейс Поиск данных Проверка правильности введенных данных Интерактивные данные Динамический. - презентация

1 JavaScript

2 Объекты языка и браузера Интерактивный интерфейс Поиск данных Проверка правильности введенных данных Интерактивные данные Динамический HTML

3 Стандартный документ window.document.formName.textName Window Document Form text Location

4 Свойства, определяющие объект document.formName.entry.value

5 Методы объекта document.orderForm.submit( ) document.orderForm.entry.select( ) document.write(hello, world) window.moveTo(50,100)

6 Обработчики событий События –Результат действия пользователя –Загрузка документа onClick

7 Размещение сценария в документе … … (W3CDOM) …

8 Использование старых браузеров

9 Операторы JavaScript Заканчиваются точкой с запятой; задачи: –Определить или инициализировать переменную –Присвоить значение свойству или переменной –Изменить значения свойства или переменной –Запустить функциональную программу –Принять решение

10 Выполнение операторов сценария При загрузке документа Сразу после загрузки документа В ответ на действия пользователя При вызове в результате выполнения оператора другого сценария

11 Типы данных JavaScript Строковый Числовой Булев Null Объект Функция

12 Переменные var myAge var myAge = 45 myAge = 45 Имена переменных

13 Выражения и их вычисление var myAge = 45 var yourAge = myAge - 15

14 Конкатенация var message = 'Hi, I am ' + name + ' ' + surname + '. '; message += 'I am ' + age + 'years old and my hair is ' + hair; alert(message);

15 Выражение document.write() document.write( of + navigator.appName +.)

16 Преобразование типов данных // result = // result = // result = var x = 5; var y = "3"; alert(x+y); y = +y; alert(x+y);

17 Преобразование строк в числа parseInt(42) // result = 42 parseInt(42.33) // result = 42 parseFloat(42) // result = 42 parseFloat(42.33) // result = parseInt(3) // result = 9

18 Преобразование чисел в строки ( ) // result = 2500 ( ).length // result = 4

19 Операторы сравнения == != > >= <

20 Управляющие структуры. if if (condition) { statement[s] if true } if (myAge < 18) { alert(Sorry, you cannot vote.) }

21 If…else if (condition) { statement[s] if true } else { statement[s] if false }

22 If…else (2) var febDays var theYear = 1993 if (theYear % 4 == 0) { febDays = 29 } else { febDays = 28 }

23 Циклы. for for ([initial expression]; [condition]; [update expression]) { statement[s] inside loop } for (var i = startValue; i

24 Функции function functionName ( [parameter1]...[,parameterN] ) { statement[s] }

25 Вызов функции обработчиком события function showMsg(msg) { alert(The button sent: + msg) }

26 Параметры функций function sayHiToFirst(a, b, c) { alert(Say hello, + a) } sayHiToFirst(Gracie, George, Harry) sayHiToFirst(Larry, Moe, Curly)

27 Локальные и глобальные переменные var aBoy = Charlie Brown // global var hisDog = Snoopy // global function demo() { // using improper design to demonstrate a point var hisDog = Gromit // local version of hisDog var output = hisDog + does not belong to + aBoy +. document.write(output) } demo() // runs as document loads document.write(hisDog + belongs to + aBoy +.)

28 Массивы Объект array - встроенный объект JavaScript. –new Array() –new Array(размер) –new Array(элемент0, элемент1, :, элементN) Можно определить начальную длину массива. billingMethod = new array(5) Когда вы создаете массив, все его элементы первоначально неопределены.

29 Массивы (2) var USStates = new Array(51) USStates[0] = Alabama USStates[1] = Alaska USStates[2] = Arizona USStates[3] = Arkansas USStates[50] = Wyoming

30 Обращение к элементу массива alert(The largest state is + USStates[1] +.)

31 Использование параллельных массивов var stateEntered = new Array(51) stateEntered [0] = 1819 stateEntered [1] = 1959 stateEntered [2] = 1912 stateEntered [3] = stateEntered [50] = 1890

32 Поиск названия штата function getStateDate() { var selectedState = document.entryForm.entry.value for ( var i = 0; i < USStates.length; i++) { if (USStates[i] == selectedState) { break } alert(That state entered the Union in + stateEntered[i] +.) }

33 Массивы объектов в документе document.forms[0] document.forms[1] document.entryForm.entry.value document.forms[0].entry.value

34 Комментарии /* */ //

35 JavaScript validator