Селекторы и XPath

Термины

  • XPath — (XML Path Language) — язык запросов к элементам XML-документа. XPath призван реализовать навигацию по DOM в XML.
  • DOM (от англ. Document Object Model — «объектная модель документа») — это не зависящий от платформы и языка программный интерфейс, позволяющий программам и скриптам получить доступ к содержимому HTML, XHTML и XML-документов, а также изменять содержимое, структуру и оформление таких документов.
  • Селекторы ( от англ. select - выбирать) - это элементы каскадной таблицы стилей CSS, которые указывают на тот элемент на веб-странице, к которому должны будут применяться стили.

Пример DOM

<!DOCTYPE HTML>
<html>
<head>
  <title>О лосях</title>
</head>
<body>
  Правда о лосях.
</body>
</html>

Основные виды селекторов

  1. * – любые элементы.
  2. div – элементы с таким тегом.
  3. #id – элемент с данным id.
  4. .class – элементы с таким классом.
  5. [name="value"] – селекторы на атрибут
  6. :visited – «псевдоклассы», остальные разные условия на элемент

Четыре вида отношений между элементами

  • div p – элементы p, являющиеся потомками div.
  • div > p – только непосредственные потомки
  • div ~ p – правые соседи: все p на том же уровне вложенности, которые идут после div.
  • div + p – первый правый сосед: p на том же уровне вложенности, который идёт сразу после div (если есть).

Селекторы атрибутов

На атрибут целиком:

- [attr] – атрибут установлен.

- [attr="val"] – атрибут равен val.

На начало атрибута:

- [attr^="val"] – атрибут начинается с val, например "value".

- [attr|="val"] – атрибут равен val или начинается с val-, например равен "val-1".

На содержание:

- [attr*="val"] – атрибут содержит подстроку val, например равен "myvalue".

- [attr~="val"] – атрибут содержит val как одно из значений через пробел.

Например: [attr~="delete"] верно для "edit delete" и неверно для "undelete" или "no-delete".

На конец атрибута:

- [attr$="val"] – атрибут заканчивается на val, например равен "myval".

Примеры псевдоклассов

  • :first-child – первый потомок своего родителя.

  • :last-child – последний потомок своего родителя.

  • :only-child – единственный потомок своего родителя, соседних элементов нет.

  • :not(селектор) – все, кроме подходящих под селектор.

  • :focus – в фокусе.

  • :hover – под мышью.

  • :empty – без детей (даже без текстовых).

  • :checked, :disabled, :enabled – состояния INPUT.

Примеры XPath

имя_узла Выбирает все узлы с именем имя_узла
/ Выбирает от корневого узла
// Выбирает узлы в документе от текущего узла, который соответствует выбору, независимо от того, где они находятся
. Выбирает текущий узел
.. Выбирает родителя текущего узла
@ Выбирает атрибуты 
<?xml version="1.0" encoding="UTF-8"?>
<bookstore>
    <book>
        <title lang="en">Harry Potter</title>
        <price>29.99</price>
    </book>
    <book>
        <title lang="en">Learning XML</title>
        <price>39.95</price>
    </book>
</bookstore>
bookstore Выбирает все узлы с именем "bookstore"
/bookstore Выбирает корневой элемент книжного магазина

Примечание: Если путь начинается с косой черты (/), он всегда представляет собой абсолютный путь к элементу!
bookstore/book Выбирает все элементы «книга» (book), которые являются потомками элемента «книжный магазин» (bookstore)
//book Выбирает все элементы «книга» независимо от того, где они находятся в документе
bookstore//book Выбирает все элементы «книга», которые являются потомком элемента «книжный магазин», независимо от того, где они находятся под элементом «книжный магазин»
//@lang Выбирает все атрибуты, которые называются "lang"
/bookstore/book[1] Выбирает первый элемент «книга», который является потомком элемента «книжный магазин».
/bookstore/book[last()] Выбирает последний элемент «книга» (book), который является дочерним элементом элемента «книжный магазин» (bookstore)
/bookstore/book[last()-1] Выбирает предпоследний элемент «книга», который является дочерним элементом элемента «книжный магазин»
/bookstore/book[position()<3] Выбор первых двух элементов «книга», которые являются потомками элемента «книжный магазин»
//title[@lang] Выбирает все элементы «название» (title), которые имеют атрибут с именем "lang"
//title[@lang='en'] Выбирает все элементы «название», которые имеют атрибут «язык» со значением "en"
/bookstore/book[price>35.00] Выбирает все элементы «книга» после элемента «книжный магазин», которые имеют элемент «цена» со значением больше, чем 35.00
/bookstore/book[price>35.00]/title Выбирает все элементы «название» книги элемента «книжный магазин», которые имеют элемент «цена» со значением больше, чем 35.00

Предикаты

Оси

  • ancestor:: — Возвращает множество предков.

  • ancestor-or-self:: — Возвращает множество предков и текущий элемент.

  • attribute:: — Возвращает множество атрибутов текущего элемента. Это обращение можно заменить на «@»

  • child:: — Возвращает множество потомков на один уровень ниже. Это название сокращается полностью, то есть его можно вовсе опускать.

  • descendant:: — Возвращает полное множество потомков (то есть, как ближайших потомков, так и всех их потомков).

  • descendant-or-self:: — Возвращает полное множество потомков и текущий элемент. Выражение «/descendant-or-self::node()/» можно сокращать до «//». С помощью этой оси, например, можно вторым шагом организовать отбор элементов с любого узла, а не только с корневого: достаточно первым шагом взять всех потомков корневого. Например, путь «//span» отберёт все узлы span документа, независимо от их положения в иерархии, взглянув как на имя корневого, так и на имена всех его дочерних элементов, на всю глубину их вложенности.

  • following:: — Возвращает необработанное множество, ниже текущего элемента.

  • following-sibling:: — Возвращает множество элементов на том же уровне, следующих за текущим.

  • namespace:: — Возвращает множество, имеющее пространство имён (то есть присутствует атрибут xmlns).

  • parent:: — Возвращает предка на один уровень назад. Это обращение можно заменить на «..»

  • preceding:: — Возвращает множество обработанных элементов исключая множество предков.

  • preceding-sibling:: — Возвращает множество элементов на том же уровне, предшествующих текущему.

  • self:: — Возвращает текущий элемент. Это обращение можно заменить на «.»

<?xml version="1.0" encoding="UTF-8"?>
<bookstore>
    <book>
        <title lang="en">Harry Potter</title>
        <price>29.99</price>
    </book>
    <book>
        <title lang="en">Learning XML</title>
        <price>39.95</price>
    </book>
</bookstore>
child::book Выбирает все узлы «книга» (book), которые являются потомками текущего узла
attribute::lang Выбирает атрибут «язык» (lang) текущего узла
child::* Выбирает всех потомков текущего узла
attribute::* Выбирает все атрибуты текущего узла
child::text() Выбирает все текстовые узлы текущего узла
child::node() Выбирает всех ближайших потомков текущего узла
descendant::book Выбирает всех потомков текущего узла
ancestor::book Выбирает всех предков «книга» (books) текущего узла
Made with Slides.com