На веб-странице необходимо отыскать элементы div, у которых присутствует атрибут id. Значение атрибута для нас пока совершенно неважно.
Решение
Для решения задачи воспользуемся селектором selector[name] (листинг 1.6.1).
Листинг1 .6 .1 . Использование селектора selector[name]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="ru" xml:lang="ru">
<head>
<title>example-1-6-1</title>
<content>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="js/jquery-1.5.2.min.js" type="text/javascript"></script>
<style type="text/css">
div { width:100px; height:100px; margin:5px; padding:5px; border:1px solid
#00f; float:left; }
</style>
<script type="text/javascript">
$(function(){
$("div[id]").css({ "border-color": "#f00", "color": "#f00" });
});
</script>
</head>
<body>
Элемент div без атрибута id, но с class="example"
Элемент div с атрибутом id="test"
Элемент div с атрибутами
id="pretest" и class="example"
Элемент div без атрибута id
Элемент div с атрибутом id="testend"
Элемент div с атрибутом id="sometestvalue"
Элемент div без атрибута id
Элемент div с атрибутом id="somevalue"
</body>
</html>
Обсуждение
В примере из листинга 1.6.1 HTML-код описывает восемь элементов div. Одни из них имеют атрибуты id или class, или даже оба атрибута вместе, а другие не имеют
атрибутов вовсе. Этот HTML-код потребуется нам для изучения всех примеров в разделе, посвященном селекторам атрибутов.
Для того чтобы отыскать все элементы div, имеющие атрибут id, в селекторе необходимо записать выражение div[id], и задача будет решена. А для наглядности мы установим значения #f00 для CSS-свойств border-color и color найденных элементов div, окрасив рамку элементов и текст внутри них в красный цвет. "Красными" окажутся второй, третий, пятый, шестой и восьмой элементы div.
Источник: Самков Г. А. jQuery. Сборник рецептов. — 2-е изд., перераб. и доп. — СПб.: БХВ-Петербург, 2011. — 416 с.: ил. + CD-ROM — (Профессиональное программирование)
Похожие посты:
- Выделение текста на странице (0)
- Изменение стиля горизонтальной линии (0)
- Центрирование текста (0)
- Удаление отступов по умолчанию для всех элементов страницы (0)
- Для каких элементов можно задавать фоновое изображение (0)
- Как задать для документа более одного фонового изображения (0)
- Выделение ссылок, ведущих на внешний сайт (0)