jquery для начинающих. Как выбрать элемент.

Итак начинаю серию уроков по jquery для начинающих. Это первое занятие :) Начнем с азов. Как с помощью  JQuery выбрать элемент. Сейчас постараюсь вам рассказать. В этой статье рассмотрим простейшие примеры. Более сложные выборки рассмотрим на последующих уроках.

Для начала нам необходимо скачать сам фреймворк JQuery. Скачать его можно тут.

Объяснять все буду на примерах, так нагляднее. Ну поехали. Для начала в коде страницы его надо подключить.

<script type="text/javascript" src="http://softlet.kz/wp-content/uploads/2010/12/jquery.js"></script>

Можете скачать себе JQuery и подключать его локально. Ну да ладно. Поехали дальше. Сейчас рассмотрим простую выборку по тегу, по классу, и по ID (айди).

Для того что мы выбрали мы будем менять цвет границы.

Допустим у нас есть 3 дива в разных частях страницы:

<div>div1</div>
<div id="div_one" class="class_for_div">div2</div>
<div class="class_for_div">div3</div>

если нам необходимо выбрать все div, то можно воспользоваться поиском по тегу:

<script type="text/javascript">
 $("div").css("border", "1px red solid");
</script>

если мы хотим выбрать элемент с определенным ID, то делаем так:

<script type="text/javascript">
 $("#div_one").css("border", "1px red solid");
</script>

ну если же нам надо элементы с определенным классом, то делаем так:

<script type="text/javascript">
 $(".class_for_div").css("border", "1px red solid");
</script>

Итого результатом первого скрипта будет выделение всех div-ов красной рамкой.  Результатом второго - выделение div2. И при третьего - div2 и div3.

Как видно - то выборка элементов происходит по аналогии с CSS - классы с помощью точки, id - с помощью #.

Запись опубликована в рубрике JQuery, Веб-программирование. Добавьте в закладки постоянную ссылку.

Комментарии запрещены.