CSS Selector in PHP

Learn how to query documents using CSS-like selectors with Inphinit\Dom\Document and DOMDocument.

Using selectors

It is possible to select elements in an external document, example:


        <!DOCTYPE html>
        <html lang="en">
        <head>
          <meta charset="UTF-8">
          <title>Sample</title>
        </head>
        <body>
          <div>Foo</div>
          <div>Bar</div>
          <div id="test">test</div>
          <div>Baz</div>
        </body>
        </html>

For example, the selector body > div targets <div> elements that are direct children of the <body> element:


          use Inphinit\Dom\Document;

          $handle = new Document(Document::HTML);

          $handle->load('document.html');

          $elements = $handle->selector()->all('body > div');
          var_dump($elements);

Selecting an element by ID:


          $element = $handle->selector()->first('#test');
          var_dump($element);

Using with DOMDocument

It is also possible to use selectors with an instance of the native PHP class DOMDocument, for example:


          use Inphinit\Dom\Selector;

          $doc = new DOMDocument;
          $doc->load('examples/book.xml');

          $selector = new Selector($doc);

          // Get the first element that matches the selector
          $element = $selector->first('ul li');

          var_dump($element);

          // Returns a DOMNodeList of elements that match the selector
          $elements = $selector->all('ul li');

          forrach ($elements as $element) {
            var_dump($element);
          }

Methods

Method	Description
`all(string $selector): DOMNodeList`	Returns all elements matching the selector
`first(string $selector): DOMNode\|null`	Returns the first element that matches the selector, or `null` if no element is found
`count(string $selector): int`	Returns the total number of elements matching the selector

Supported selectores

Selector	Description	Note
`*`	Any element (universal selector)	-
`E`	An element of type `E`	-
`E.warning`	An `E` element whose class is `warning` (class selector)	-
`E#myid`	An `E` element with ID equal to `myid` (ID selector)	-
`E F`	An `F` element descendant of an `E` element (descendant combinator)	-
`E > F`	An `F` element child of an `E` element (child combinator)	-
`E + F`	An `F` element immediately preceded by an `E` element	-
`E ~ F`	An `F` element preceded by an `E` element	-
`E[foo]`	An `E` element with a `foo` attribute	-
`E[foo="bar"]`	An `E` element whose `foo` attribute value is exactly equal to `bar`	-
`E[foo="bar" i]`	To match attribute values case-insensitively, the attribute selector may include the identifier `i` before the closing bracket `]`	Also supported by `^=`, `$=`, `*=` and `\|=`
`E[foo~="bar"]`	An `E` element whose `foo` attribute value is a list of whitespace-separated values, one of which is exactly equal to `bar`	-
`E[foo^="bar"]`	An `E` element whose `foo` attribute value begins exactly with the string `bar`	-
`E[foo$="bar"]`	An `E` element whose `foo` attribute value ends exactly with the string `bar`	-
`E[foo*="bar"]`	An `E` element whose `foo` attribute value contains the substring `bar`	-
`E[foo\|="en"]`	An `E` element whose `foo` attribute has a hyphen-separated list of values beginning (from the left) with "en"	-
`E:empty`	An `E` element that has no children (including text nodes)	-
`E:lang(fr)`	An element of type `E` in language `fr`	-
`E:first-child`	An `E` element, first child of its parent	-
`E:last-child`	An `E` element, last child of its parent	-
`E:nth-child(n)`	An `E` element, the n-th child of its parent	Only a few combinations are supported, like: `:nth-child(<a>n+<b>)`, `:nth-child(<a>n)`, `:nth-child(<a>)`, `:nth-child(even)`, `:nth-child(odd)` (`<a>` and `<b>` represents numbers in form)
`E:contains(bar)`	An `E` element whose contents contains the substring `bar`	non-standard
`E:contains-child(bar)`	An `E` element whose contents contains the substring `bar` only on nodeTexts that are direct children	non-standard