Embed Size (px)
DESCRIPTION
www.spro-club.ru
Citation preview
План Какой сайт можно назвать живым? Какие технологии и инструменты
существуют для создания живых сайтов?
Что такое библиотека jQuery? Какие задачи она позволяет решать?
Где взять и как подключить jQuery? Простейшие примеры использования Cookbook - «Поваренная книга»
готовых рецептов
«Живые» сайты (ЖС)? ЖС – это интерактивный динамический
сайт. Он способен реагировать на действия
пользователей, а не просто отображать информацию (текст, графику, аудио и видео)
«Живым» сайтом пользоваться не только приятно, но и удобно
По функциональности ЖС приближаются к настольным приложениям с графическим интерфейсом
ЖС – отличительная особенность концепции Web 2.0
Что нужно знать? HTML CSS Блочная модель элементов JavaScript
Инструменты для создания ЖС
Все инструменты работают на стороне клиента (выполняются браузером)
Скриптовые языки: JavaScript, Jscript, VBScript и т.п.
Java-апплеты Flash SilverLight Готовые скриптовые библиотеки:
jQuery, extJS, Dojo, MochiKit, MooTools, Prototype, Rico и др.
Что такое jQuery? Библиотека JavaScript-функций Опубликована в 2006 г Девиз – «Write less, do more» - делайте
больше меньшими усилиями JQuery отделяет поведение от структуры
HTML (принцип «ненавязчивого» JavaScript)
Архитектура: ядро + плагины Основная цель создания jQuery:
повторное использование JavaScript-кода (чтобы не изобретать велосипед)
кросс-браузерность (один и тот же код работает в разных браузерах)
Где взять jQuery Официальный сайт - http://jquery.com Текущая версия: 1.7.1 Поставляется в двух вариантах:
для разработчика (Development) – 230 Кб
для публикации (Production) – 31 Кб jQuery – это СПО (свободное ПО)
Подключение jQuery jQuery включается в веб-страницу
как один внешний JavaScript-файл:
Все возможности библиотеки доступны с помощью функции jQuery() или её сокращённого имени – $():
<head> <script type="text/javascript"
src="путь/к/jQuery.js"></script> </head>
$(“h1”).addClass("blue") .slideDown("slow");
$(“input#showComment”).fadeOut();
Получение элементов $("#header") — получение элемента
с id=«header» $(«h3») — получить все <h3>
элементы $(«div#content .photo») — получить
все элементы с классом =«photo» которые находятся в элементе div с id=«content»
$(«ul li») — получить все <li> элементы из списка <ul>
$(«ul li:first») — получить только первый элемент <li> из списка <ul>
Схема использования
Использованные источники http://ru.wikipedia.org/wiki/
Библиотека_JavaScript http://ru.wikipedia.org/wiki/JQuery Бер Бибо, Иегуда Кац. jQuery.
Подробное руководство по продвинутому JavaScript (2009)
http://habrahabr.ru/post/38208/
