Скрипты и коды для юкоз

Главная » Статьи » Web-программирование

В разделе материалов: 18
Показано материалов: 11-18

Страницы: « 1 2

jQuery. Работа с элементами. Использование CSS селекторов

Использование CSS селекторов

В jQuery используются стандартные CSS-селекторы. Вы наверняка с ними знакомы.
Вот несколько примеров, чтобы освежить знания:

Code

a - будут выбраны все ссылки (

<a>);

#someid - будет выбран элемент с

id = someid;

.someclass - будут выбраны все элементы класса someclass;

a#someid.someclass - будeт выбрана ссылка с

id = someid класса someclass;

p a.someclass - будут выбраны все ссылки класса someclass внутри абзаца (<p>);

Таким образом, для того, чтобы использовать селектор в jQuery, достаточно написать его внутри известной нам уже конструкции $(), например вот так:

jQuery. Селекторы

Последнее время мне всё чаще задают вопрос как выбрать тот или иной элемент в DOM`е, и данный пост будет сплошь посвящен селекторам в jQuery, возможно большинство из них Вы видели в различных источниках, но собрать их воедино все же стоит...

Селекторы в jQuery

Селекторы в jQuery базируются на CSS селекторах, а так же поддерживают XPath.
Дабы не закапываться в документацию буду приводить примеры, много примеров.
Но начнем с самых азов...

Для начала нам понадобиться макет HTML странички (вполне типичный макет):

Введение в jQuery

Для чего нужно (нужна, нужен) jQuery - чтобы облегчить работу веб-программиста.
С помощью этой библиотеки нам (веб-программистам) проще повысить функциональность наших страниц с минимальным выполнением монотонной работы.

В своей основе jQuery ориентировано на работу с элементами HTML страниц.

Wrapper

В CSS для выбора, например, всех ссылок <a> внутри абзаца <p> мы писали ....

jQuery. Знакомство с бесплатным JavaScript Framework-ом

jQuery - это полностью бесплатный javascript framework (фреймворк - это набор готовых функций для облегчения решения типовых задач).

Слова "полностью бесплатный" добавлены потому, что есть и не совсем бесплатные, например ExtJS.
На самом деле jQuery гораздо больше, чем просто фреймворк, это новая психология программирования на javascript, если можно так выразиться. Я бы сравнил появление jQuery с появлением самого javascript. И это не просто громкие слова.

Те, кто уже работает с jQuery подтвердят, что по прошествии некоторого времени начинаешь забывать структуры обычного javascript кода, а строка

Оживляем страницу с jQuery

Манипулирование со свойствами объектов.

Самый простой способ проверить или изменить элементы выбранного нами набора позволяет нам команда each():

Code

$('img').each(function(n){
this.alt='Это image['+n+'] с id равным '+this.id;
});

Это выражение применит указанную функцию к каждому элементу <img> на странице, при этом будет изменен атрибут alt используя порядковый номер элемента и его id.

Получение и изменение значения атрибутов.

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

Так, метод attr() может использоваться как для получения значения атрибутов, так и для их установки.
Если методу будет передано только название атрибута, он вернет его значение, например:

jQuery для JavaScript

Когда jQuery, библиотека JavaScript, увидела свет в январе 2006, все подумали: «очередная красивая игрушка». Выбор CSS-селекторов в качестве базиса было, конечно, изящной идеей, но использование цепочек преобразований выглядело немного замысловато, и сама библиотека, по-видимому, не покрывала всех возможных случаев. jQuery расценивали тогда только как временное и проходящее решение.

Только несколько месяцев спустя стало понятно, что jQuery является просто произведением инженерного искусства. Она умело покрывает достаточно широкий диапазон повседневных функций и предоставляет при этом удобный API для расширений, с помощью которых можно добавить любую другую функциональность. Абстрактность в ней заложена на уровне ядра - речь идет о выборе элементов объектной модели документов (DOM) - и она извлекает из него максимум пользы. И что важнее всего, использование этой библиотеки подразумевает следование хорошему стилю в программировании и хорошо сочетается с другими частями JavaScript-кода.

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

Закрепляем jQuery - 25 отличных советов

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

Я не эксперт в jQuery. И даже не претендую, поэтому, если встретите ошибки, смело поправляйте меня и вносите предложения по улучшению (поправлять и присылать поправки нужно автору статьи, а не перевода - зам. пер.).

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

jQuery. Работа с css свойствми элемента

В данной статье по документации jQuery будет рассматриваться работа с CSS свойствами.
Будем получать и устанавливать значения CSS-свойств для элементов, в том числе работать с шириной и высотой, а также определять позицию элемента.

CSS

Css (name)

Возвращает: String

Возвращает значения для css-свойства, указанного в name, для первого элемента в наборе.

В этом примере, чтобы получить доступ к css-свойству background-color нужно всего лишь кликнуть по элементу div.

1-10 11-18