- •Лабораторный практикум
- •Лабораторная работа №1 Основы разметки гипертекста html
- •Введение
- •Заголовки
- •Оформление текста
- •Создание списков
- •Гиперссылки
- •Изображения в html-документе
- •Задание 1.
- •Задание2.
- •Задание 3
- •Лабораторная работа №2 Создание таблиц в html-документах
- •Создание таблицы
- •Задание
- •Контрольные вопросы.
- •Лабораторная работа №3 Каскадные таблицы стилей
- •Введение
- •Внутренние таблицы стилей.
- •Встроенные таблицы стилей.
- •Структура правила.
- •Селекторы классов.
- •Универсальные селекторы.
- •Комментарии css.
- •Объединение css и html.
- •Элемент style.
- •Директива @import.
- •Задание 1.
- •Задание 2.
- •Задание 3.
- •Стандартные имена для фреймов
- •Специальные эффекты, получаемые с помощью атрибута target
- •Задание
- •Контрольные вопросы
- •Лабораторная работа №5 Формы
- •Введение
- •Элементы ввода данных
- •Многострочный текст, атрибуты текстовых элементов
- •Альтернативная кнопка, перегрузка атрибутов формы
- •Выбор из списка
- •Генерирование открытого и секретного ключей
- •Другие элементы форм
- •Атрибуты элементов ввода
- •Задание.
- •Контрольные вопросы.
- •Лабораторная работа №6 Объектно Ориентированное Программирование в JavaScript.
- •Основные понятия:
- •Объект.Метод("параметры метода")
- •Значение по умолчанию
- •Применяется к тегам
- •Событие onchange
- •Событие onclick
- •Событие ondblclick
- •Задание №1
- •Размещение JavaScript на html-странице
- •Типы данных
- •Объявления переменных
- •Переменные
- •Типы переменных
- •Массивы
- •Объекты JavaScript
- •Объект Array
- •Оператор цикла
- •Условные операторы
- •Объектная модель JavaScript
- •Объекты и Свойства
- •Функции и Методы
- •Определение Методов
- •Создание Новых Объектов
- •Использование this для Ссылок Объекта
- •Объектная модель браузера
- •Объект window
- •Лабораторная работа № 8 Изучение языка php
- •Общие правила построения php-программы
- •Задание
- •1. Вывод на экран и переменные в рнр.
- •2. Передача параметров по ссылке, передача параметров из формы (get и post -- запросы).
- •3. Динамическое формирование страницы.
- •4. Работа с файлами.
- •Лабораторная работа № 10 Работа вебсайта
- •Как еще можно прописать сайт в Денвере?
- •Лабораторная работа № 11 Файловый ввод/вывод
- •1) Классическая модель веб-приложения
- •2) Модель ajax
- •Лабораторная работа №12 Внедрение рисунков
- •1. Основные положения
- •Рисование прямоугольников
- •Рисование составных фигур Составные фигуры состоят из нескольких соединенных простых объектов (таких как линии, круги и т.Д.)
- •Структура программы выглядит следующим образом
- •С помощью свойства lineCap можно оформлять кончики линии
- •Можно создавать более сложные градиенты, которые изменяют цвет в нескольких точках.
- •Папоротник
- •Гипно-спираль
- •Вставка изображений
- •4. Вложение изображения с помощью data: url
- •Рисование изображений
- •Пример 1 использования изображения
- •Масштабирование
- •Пример 2 использования изображения
- •Разрезание изображений
- •Пример 3 использования изображения
- •Пример галереи
- •Javascript графика: Объект Image.
- •Javascript графика: src и lowsrc.
- •Изменение картинки.
- •Мультипликация в JavaScript. Мультипликация.
- •Запуск мультипликации
- •Запуск и остановка мультипликации
Размещение JavaScript на html-странице
Скрипт размещается между двумя парными тегами <SCRIPT>...</SCRIPT>. Обычно запись скрипта выглядит так:
|
<SCRIPT language=JavaScript> <!-- ... Код на JavaScript ... //--> </SCRIPT> <NOSCRIPT> ... Для браузеров, которые не поддерживают JavaScript ... </NOSCRIPT> |
Начало скрипта Скрипт представлен как HTML-комментарий, чтобы не "смущать" браузеры,которые о скриптах не знают.
Конец скрипта Эта команда специально для пользователей, у которых браузер не понимает скриптов. Впрочем, таких браузеров практически не осталось |
Типы данных
JavaScriptраспознает следующие типы величин:
числа, типа 42 или 3.14159;
логические (Булевы), значения true или false;
строки, типа "Howdy!";
пустой указатель, специальное ключевое слово, обозначающее нулевое значение.
Преобразование типов данных
Тип переменной зависит от того, какой тип информации в ней хранится. JavaScript не является жестко типизированным языком. Это означает, что программист может не определять тип данных переменной, в момент ее создания. Тип переменной присваивается переменной автоматически в течение выполнения. Таким образом можно определить переменную следующим способом:
var answer = 42
А позже, можно присвоить той же переменной, например, следующее значение:
answer = "Thanks for all the fish..."
Объявления переменных
Переменная должна быть объявлена до ее использования.
Для объявления используется ключевое слово var:
Var x; // переменная с именем "x".
Var y = 5; // описание с присвоением числа
Var mes = "дядя Федор"; // описание с присвоением строки
Переменные
Переменные в javascript слабо типизированы. Это означает, что при объявлении не нужно указывать тип. Можно присвоить любой переменной любое значение. Однако при этом интерпретатор javascript (браузер) всегда знает, какого типа значение содержит данная переменная, а значит - какие операции к ней применимы. Переменную не обязательно объявлять. Достаточно ее просто присвоить:
x = 5
Далее мы разберем основные типы переменных и действия с ними.
Типы переменных
Существует 4 типа переменных:
number – действительное или целое число;
boolean – значение true и false;
string- строка;
object – объекты.
Объявление переменных производится при помощи ключевого слова var. например,
var i, k;
k=2;
До инициализации переменной ее значение остается неопределенным и равным undefined.
Операция typeof возвращает тип данных, хранящихся в текущий момент в переменной.
<html>
<body>
<h1> Пример арифметического выражения</h1>
<script language="javascript">
var x=1, y=2, z;
z=x+y;
document.write('z='+z);
document.write('z.typeof()='+z. typeof());
</script>
</body>
</html>
Массивы
/* обычный синтаксис */
Var array = [ elem0, elem1, elem2, ... ]
Var empty = []
/* Синтаксис с new Array() */
var array = new Array( elem0, elem1, elem2, ...)
var empty = new Array()
/* Редкий синтаксис: аргумент new Array - одно число.
При этом создается массив заданной длины,
все значения в котором undefined */
var array = new Array(10)
Аргументы
elem0, elem1, ...
Если ни один из параметров elem0, elem1, ... не указан, то инициализируется пустой массив.
Если указан лишь один числовой параметр elem0 и массив объявлен через new Array, то будет инициализирован пустой массив длины, равной данному числу. При этом все элементы являются undefined.
В ином случае создается массив из перечисленных элементов.
Массив пронумерованных элементов, также может служить стеком или очередью. Для ассоциативных массивов используйте Object.
Пример: Создать пустой массив
var arr = []
Пример: добавить элемент в конец
arr[arr.length] = 5 /* или arr.push(5) */
Пример: Создать массив из разных элементов
Var arr = [ 4, "test", , false, [0,1] ]
alert(arr[1]) // => "test"
alert(arr[2]) // => undefined
alert(arr[3]) // => false
alert(arr[4][1]) // => 1
Можно добавить объект под любым индексом, даже превосходящим текущую длину массива. При этом массив хранит (и потребляет память) только те элементы, которые установлены.
В примере ниже массив будет хранить два элемента: номер 1 и номер 999.
Пример: разреженный массив
var arr = []
arr[1] = 5
arr[999] = 6
alert(arr[0]) // => undefined, такого значения нет
alert(arr.length) // => 1000 : последний индекс+1
Многомерные массивы
Для многомерных массивов в javascript нет кросс-браузерного синтаксиса.
Обычно используется массив массивов, например:
// 3 в ширину 3 в высоту
// каждый подмассив - колонка
var matrix = [ [1,2,3], [4,5,6], [7,8,9] ]
alert(matrix[1][1]) // 5