jQuery — это JavaScript библиотека, написанная на языке JavaScript, фокусирующаяся на взаимодействии JavaScript и HTML. Данная библиотека является кроссплатформенной и распространяется по лицензии MIT License и GNU GPL. Автор данной библиотеки Джон Ресиг. Официальный сайт http://jquery.com/
jQuery является очень мощным инструментов, который позволит упростить и усовершенствовать Ваши веб-страницы.
Какие знания необходимо иметь при изучении данной технологии:
- html,
- CSS,
- желательно JavaScript.
Это минимальный набор требований, которыми должен обладать человек желающий овладеть технологией jQuery.
Для того чтобы начать изучать библиотеку вам необходимо сделать следующее:
- Скачать последнюю версию данной библиотеки с официального сайта (ссылка).
Приступим
Создайте простую html страничку в блокноте или в любом другом html редакторе (пример кода страницы можно посмотреть ниже).
Пример кода странички:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Урок 1. Знакомство с jQuery</title>
<link rel="stylesheet" type="text/css" href="common.css">
<script type="text/javascript" src="../scripts/jquery-1.2.1.js"></script>
<script type="text/javascript">
$(function() {
$("<div>Hello world!</div>").insertAfter("body");
});
</script>
</head>
<body>
</body>
</html>
Рассмотрим более детально наш html код.
<script type="text/javascript" src="jquery-1.2.1.js"></script>
Данная часть кода позволяет нам подключить библиотеку jQuery к нашей веб-странице.
$(function() {
$("<div>Hello world!</div>").insertAfter("body");
});
Обратите внимание на конструкцию $(function() {…});. Что она означает? Мы вызываем функцию $() тем самым говорим браузеру дождаться пока дерево DOM (и только дерево DOM) будет полностью загружено, после чего создаем html элементы типа <div> с текстом «Hello world!» и вставляем его в тег <body>.
. insertAfter(E) – функция позволяет добавить элемент на странице после элемента E.
Итог
Открываем нашу страницу через веб-браузер и если Все было сделано правильно, то в Вашем окне браузера Вы увидите фразу «Hello world!».
В данном уроке можно увидеть, что библиотека является очень простой и понятной, в последующих уроках мы разберем все более детально, и Вы сможете увидеть насколько полезна она может быть.
Спонсор статьи веб-студия «proflead».
