SiteIS

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

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

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

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

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

Главная / jQuery шпаргалки / Выборка элементов / Выборка первого элемента

Выборка единственного дочернего элемента

  • Задача 1:

    - изменить цвет шрифта на #00cc00 полследнему элементу li в списке.

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

    • Решение:

      $(function () {
	$('ul li:only-child').css('color', '#00cc00');
});

      Пояснение:

      Для решения задачи с помощью фильтра $('ul li:only-child') обращаемся к пункту списка и меняем цвет его шрифта, если этот пункт является единственным в списке. В противном случае (если пунктов будет больше одного) никаких изменений не произойдет.

      Результат:

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

  • Задача 2:

    - изменить фоновый цвет на #00cc00 каждому элементу span, если этот пункт является единственнымв блоке div на странице.

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

    • Решение:

      $(function () {
	$('div span:only-child').css('background', '#00cc00');
});

      Пояснение:

      Для решения задачи с помощью фильтра $('div span:only-child') обращаемся ко всем элементам span, которые являются единственными расположенным в блоках div, и меняем им фоновый цвет. Следует помнить, что если помимо элемента span в блоке будет текстовый узел, не обрамленный ни в какие теги, элемент span будет являться единственным дочерним (его фоновый цвет изменится).

      Результат:

      При загрузке страницы, у всех элементов span, которые являются единственными расположенных в блоках div, изменится фоновый цвет.

Автор: Super User