Hello, world!

Каждый приличный урок по программированию обязательно начинается с "Hello, world!" примера и наш курс не является исключением. В предыдущих главах мы научились, как добавлять jQuery на страницу, так что теперь ничего не мешает нам использовать все его преимущества. Однако сначала было бы неплохо узнать, как все-таки работает jQuery. Давайте сразу обратимся к примеру:

<div id="divTest1"></div>
<script type="text/javascript">
$("#divTest1").text("Hello, world!");
</script>

Итак, у нас есть тег div с id "divTest1". В JavaScript мы используем значок доллара $ чтобы вызвать нужный нам фреймворк jQuery, затем мы выбираем все элементы с указанным id (в примере у нас только один такой элемент) и присваиваем ему текст "Hello, world!". Пока что вам необязательно понимать, почему это работает именно так, но по ходу уроков все элементы будут рассмотрены более подробно.

Давайте выполним ту же самую задачу в JavaScript без jQuery и сравним результат. Хм, кажется, нам нужно больше строк на этот раз:

<div id="divTest2"></div>
<script type="text/javascript">
document.getElementById("divTest2").innerHTML = "Hello, world!";
</script>

Мы потратили бы больше времени, если бы наш HTML элемент обладал, скажем, только классом, без ID.

Обычно же, стоит подождать, пока документ не придет в состояние готовности, чтобы как-то работать с его содержимым. Простые примеры выше и более продвинутые так же будут работать в большинстве браузеров, но для некоторых задач требуется полная загрузка документа. К счастью, jQuery с легкостью справляется и с такого рода задачами, как мы увидим в дальнейшем. Скоро мы наконец приступим к самым главным аспектам jQuery, уже упоминавшимся в предыдущих примерах, а именно: селекторам.