SiteIS

jQuery - безграничные возможности в дизайне Вашего сайта!

- Один из самых популярных на сегодня среди веб разработчиков фреймворк

- Позволяет быстро и легко создать потрясающие веб-приложения

- Удивительно красивые анимационные эффекты

- Улучшение пользовательского интерфейса

Выбор дочерних элементов

  • Задача 1:

    - выбрать все элементы span, являющимися дочерними по отношению к элементу div с классом pr и обвести их черной однопиксельной рамкой.

    Показать решение
    • Решение:

      $(function () {
      	$('div.pr > span').css('border','1px solid #000000');
      });
      

      Пояснение:

      Для решения задачи с помощью селектора $('div.pr > span') обращаемся ко всем элементам span, дочерним элементам блока с классом pr и обводим их черной однопиксельной рамкой. Если элементы span находятся на втором, или ниже уровне вложенности, то они отобраны не будут.

      Результат:

      При загрузке страницы, черной однопиксельной рамкой будут обведены только те элементы span, которые являются дочерними по отношению к блоку с классом pr

  • Задача 2:

    - выбрать все элементы li, являющимися дочерними по отношению к элементу ul с классом pr и изменить для них цвет шрифта #00cc00.

    Показать решение
    • Решение:

      $(function () {
      	$('ul.pr > li').css('color','#00cc00');
      });
      

      Пояснение:

      Для решения задачи с помощью селектора $('ul.pr > li') обращаемся ко всем элементам li, дочерним элементам ul с классом pr и с помощью метода jQuery .css(); изменяем цвет шрифта для них. Следует помнить, что цвет шрифта наследуется и что бы метод сработал как надо, в css таблице для всех ul требуется определить цвет по умолчанию.

      Результат:

      При загрузке страницы, у всех дочерних элементов li элемента ul с классом pr цвет шрифта станет зеленым.

Автор: Super User