
- •Конспект лекцій з дисципліни
- •Лекція 1. Принципи організації глобальної мережі Інтернет. Введення в Веб-технології: структура та принципи Веб.
- •Предмет курсу
- •Характеристика Інтернет
- •Стек протоколів tcp / ip
- •Система доменних імен dns
- •Структура і принципи www
- •Проксі-сервери
- •Протоколи Інтернет прикладного рівня
- •Лекція 2. Принципи побудови Веб-сайтів. Структура Веб застосуваннь. Характеристика мови html.
- •Історія розвитку html
- •Принципи гіпертекстової розмітки
- •Групи тегів нтмl
- •Лекція 3. Структура html-документа і елементи розмітки заголовка документа.
- •Призначення заголовка
- •Відображення змісту елемента title
- •Основні контейнери заголовка
- •Елемент розмітки head
- •Елемент розмітки title
- •Елемент розмітки base
- •Елемент розмітки meta
- •Елемент розмітки link
- •Елемент розмітки style
- •Елемент розмітки script
- •Лекція 4. Контейнери тіла документа.
- •Теги тіла документа
- •Тіло документа - контейнер body
- •Теги управління розміткою Заголовки
- •Атрибут аlign
- •Теги управління відображенням символів
- •Теги, що управляють формою відображення
- •Верхні і нижні індекси
- •Атрибут sizе
- •Атрибут соlоr
- •Створення списків в html
- •Атрибути маркерів у ненумерований списку
- •Коментарі в мові html
- •Гіпертекстові посилання
- •Лекція 5. Графіка.
- •Використання графіки в html.
- •Атрибут src
- •Атрибут alt
- •Атрибут аlign
- •Формати графічних файлів
- •Активні зображення
- •Зображення в мініатюрі
- •Лекція 6. Таблиці html.
- •Засоби опису таблиць в html
- •Створення таблиць в html
- •Атрибут nowrap
- •Атрибут соlspan
- •Атрибут rowspan
- •Атрибут widтн
- •Застосування порожніх клітинок
- •Атрибут сеllраdding
- •Атрибути аlign і valign
- •Атрибут border
- •Атрибут cellspacing
- •Атрибут bgcolor
- •Атрибут background
- •Використання таблиць в дизайні сторінки
- •Лекція 7. Використання html-форм
- •Html-Форми
- •Завдання форми - елемент form
- •Атрибут cols
- •Атрибут name
- •Атрибут rows
- •Алгоритм роботи фреймів
- •Створення простої сторінки з фреймами
- •Завдання фреймової структури
- •Підготовка вмісту фрейма
- •Підготовка фрейму main
- •Атрибути rows і соls
- •Атрибут rows
- •Атрибут сols
- •Атрибут nаме
- •Атрибут маrginwidth
- •Атрибут маrginheight
- •Атрибут scrolling
- •Атрибут noresize
- •Атрибут srс
- •Атрибут таrgет
- •Вкладені і множинні кадрові структури
- •Лекція 9. Призначення і застосування каскадних таблиць стилів css
- •Призначення css
- •Способи застосування css
- •Перевизначення стилю
- •Елемент style
- •Посилання на зовнішній опис
- •Імпорт опису стилів
- •Селектор - ім'я елемента розмітки
- •Селектор - ім'я класу
- •Селектор - ідентифікатор об'єкта
- •Спадкування й перевизначення
- •Лекція 10. Блокові і стрічкові елементи css
- •Блокові і стрічкові елементи
- •Елемент div
- •Елемент span
- •Властивості блоків
- •Відступи (margin)
- •Набивання (padding)
- •Рамка (border)
- •Обтікання блоку тексту
- •Лекція 11.Позиціонування у css
- •Координати і розміри
- •Абсолютні координати
- •Відносні координати
- •Лінійні розміри блоку
- •Управління видимістю
- •Порядок накладення і область видимості
- •Порядок накладення блоків. Z-index
- •Область видимості блоку. Clip
- •Лекція 12. Призначення та застосування JavaScript.
- •Метод join ()
- •Метод reverse ()
- •Метод sort ()
- •Оператори мови
- •Лекція 14. Об'єктна модель броузера.
Метод join ()
Метод join () дозволяє об'єднати елементи масиву в один рядок. Він є зворотним до методу split (), який розрізає об'єкт типу String на шматки і складає з них масив. До речі, метод split () демонструє той факт, що масив можна отримати і без конструктора масиву.
Розглянемо приклад перетворення локального URL в глобальний URL, де в якості адреси сервера буде виступати www.intuit.ru. Нехай у змінній localURL зберігається локальний URL деякого файлу:
localURL = "file: / / / C: / department/internet/js/2/2.html"
разрєжєм рядок у місцях входження комбінації символів ":/", виконавши команду: b = localURL.split (':/'). Отримаємо масив:
b [0] = "file";
b [1] = "/ / C";
b [2] = "department/internet/js/2/2.html";
Замінюємо 0-й і 1-й елементи на необхідні:
b [0] = "http:";
b [1] = "/ www.intuit.ru";
Нарешті, склеюємо отриманий масив, вставляючи косу риску в місцях склеювання: globalURL = b.join ("/" ). У результаті ми отримуємо необхідний глобальний URL - значення globalURL дорівнюватиме: http://www.intuit.ru/department/internet/js/2/2.html.
Метод reverse ()
Метод reverse () застосовується для зміни порядку елементів масиву на протилежний. Припустимо, масив впорядкований наступним чином:
a = new Array ('мати', 'бачить', 'дочка');
Впорядкуємо його у зворотному порядку, викликавши метод a.reverse (). Тоді новий масив a буде містити:
a [0] = 'дочка';
a [1] = 'бачить';
a [2] = 'мати';
Метод sort ()
Метод sort () інтерпретує елементи масиву як рядкові літерали і сортує масив в алфавітному (т.зв. лексикографічному) порядку. Зверніть увагу: метод sort () змінює масив. У попередньому прикладі, застосувавши a.sort (), ми отримаємо на виході:
a [0] = 'бачить';
a [1] = 'дочка';
a [2] = 'мати';
Однак, це незручно, якщо потрібно відсортувати числа, оскільки згідно з алфавітним порядком 40 йде раніше ніж 5. Для цих цілей у методу sort () є необов'язковий аргумент, який є іменем функції, згідно з якою потрібно відсортувати масив, тобто в цьому випадку виклик методу має вигляд: a.sort (myfunction). Ця функція повинна задовольняти певним вимогам:
у неї повинно бути рівно два аргументи;
функція повинна повертати число;
якщо перший аргумент функції повинен вважатися меншим (більшим, рівним) ніж другий аргумент, то функція повинна повернути негативне (позитивне, нуль) значення.
Наприклад, якщо нам потрібно сортувати числа, то ми можемо описати наступну функцію:
function compar (a, b) {
if(a < b) return -1;
if(a > b) return 1;
if (a == b) return 0;
}
Тепер, якщо у нас є масив b = new Array (10,6,300,25,18);, то можна порівняти результати сортування без аргументу і з функцією compar як аргумент:
document.write ("Алфавітний порядок: <BR>" );
document.write (b.sort ());
document.write ("<BR> Числовий порядок: <BR>");
document.write (b.sort (compar));
В результаті виконання цього коду отримаємо наступне:
Алфавітний порядок:
10,18,25,300,6
Числовий порядок:
6,10,18,25,300
Зверніть увагу: метод sort () інтерпретує елементи масиву як рядки (і виробляє лексикографічну сортування), але не перетворює їх в рядки. Якщо в масиві були числа, то вони числами і залишаться. У цьому легко переконатися, якщо в кінці останнього приклад виконати команду document.write (b [3] +1): результат буде 26 (тобто 25 +1), а не 251 (тобто "25" +1 ).