Логотип сайта
расширенный поиск по сайту
Меню сайта
Популярные новости
Нравится
soft-personal

Jquery для начинающих

Здравствуйте, уважаемые!

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

Почему jQuery? Каждый ответит на этот вопрос по-своему, начав изучать его и используя его в своих web-проектах. Для себя я отвечаю на этот вопрос так: Зачем писать на «чистом» javascript десятки строк, когда можно подключать jQuery-библиотеку и написать всего 1 или 2, которые будут нагляднее демонстрировать логику приложения. И еще, для jQuery написано множество библиотек, расширяющих его возможности, да и самому написать плагин для jQuery не составит большого труда. Дополнения могут в разы уменьшить код и облегчить продумывания логики.

Перед началом скучной теории, хочу показать как легко можно раскрасить каждую вторую строку таблицы средствами jQuery.

Создадим класс для четных строк, который будет инвертировать цвет фона и цвет текста.
.even {background-color: #000; color: #fff

Подключаем саму библиотеку jQuery через Google API (я предпочитаю именно этот вариант), потому как думаю, что даже когда придет конец света, гугл все равно стоять будет и предоставлять свои функции.



Этому селектору соответствуют ссылки, которые являются прямыми потомками элемента P (параграф).

Сейчас попробуем выбрать ссылки, которые ведут на другой сайт: по большей части, внешние ссылки имеют начало «http://». Теперь запишем это.
$("a[href^=http://]")

Конструкций ^= показывает, что следует сопоставить это выражение с началом, как в регулярных выражениях.

Если нам нужно выбрать все ссылки, которые указывают на архивы, пишем
$("a[href$=.rar]")

В этой коллекции окажутся все ссылки, заканчивающиеся на «.rar»

Таких конструкций, облегчающих нам жизнь в CSS очень много, еще хотелось бы сказать об одной. А именно выборке только текстовых полей из всего разнообразий input-элементов.
$("input[type=text]")


Также мы можем выбирать элементы по позиции.
Например, a:first – выберет только первую ссылку.
Нечентый элемент p:odd позволит, например, нам сделать красивые отступы абзацев.
Подобных селекторов тоже не мало, мы познакомимся с ними в течение последующих уроков.
Разделы сайта











  Яндекс.Метрика
 
Powered by DLE © 2010-2015, Soft-Personal.ru
Реклама на сайте