` if it has an `

` descendant with `id='hi'`. Functions --------- ### Node functions ```bash name() # //[starts-with(name(), 'h')] text() # //button[text()="Submit"] # //button/text() lang(str) namespace-uri() ``` ```bash count() # //table[count(tr)=1] position() # //ol/li[position()=2] ``` ### Boolean functions ```bash not(expr) # button[not(starts-with(text(),"Submit"))] ``` ### String functions ```bash contains() # font[contains(@class,"head")] starts-with() # font[starts-with(@class,"head")] ends-with() # font[ends-with(@class,"head")] ``` ```bash concat(x,y) substring(str, start, len) substring-before("01/02", "/") #=> 01 substring-after("01/02", "/") #=> 02 translate() normalize-space() string-length() ``` ### Type conversion ```bash string() number() boolean() ``` Axes ---- ### Using axes ```bash //ul/li # ul > li //ul/child::li # ul > li (same) //ul/following-sibling::li # ul ~ li //ul/descendant-or-self::li # ul li //ul/ancestor-or-self::li # $('ul').closest('li') ``` Steps of an expression are separated by `/`, usually used to pick child nodes. That's not always true: you can specify a different "axis" with `::`. | `//` | `ul` | `/child::` | `li` | | Axis | Step | Axis | Step | {: .-css-breakdown} ### Child axis ```bash # both the same //ul/li/a //child::ul/child::li/child::a ``` `child::` is the default axis. This makes `//a/b/c` work. ```bash # both the same # this works because `child::li` is truthy, so the predicate succeeds //ul[li] //ul[child::li] ``` ```bash # both the same //ul[count(li) > 2] //ul[count(child::li) > 2] ``` ### Descendant-or-self axis ```bash # both the same //div//h4 //div/descendant-or-self::h4 ``` `//` is short for the `descendant-or-self::` axis. ```bash # both the same //ul//[last()] //ul/descendant-or-self::[last()] ``` ### Other axes | Axis | Abbrev | Notes | | --- | --- | --- | | `ancestor` | | | | `ancestor-or-self` | | | | --- | --- | --- | | `attribute` | `@` | `@href` is short for `attribute::href` | | `child` | | `div` is short for `child::div` | | `descendant` | | | | `descendant-or-self` | `//` | `//` is short for `/descendant-or-self::node()/` | | `namespace` | | | | --- | --- | --- | | `self` | `.` | `.` is short for `self::node()` | | `parent` | `..` | `..` is short for `parent::node()` | | --- | --- | --- | | `following` | | | | `following-sibling` | | | | `preceding` | | | | `preceding-sibling` | | | {: .-headers} There are other axes you can use. ### Unions ```bash //a | //span ``` Use `|` to join two expressions. More examples ------------- ### Examples ```bash //* # all elements count(//) # count all elements (//h1)[1]/text() # text of the first h1 heading //li[span] # find a
with an inside it # ...expands to //li[child::span] //ul/li/.. # use .. to select a parent ``` ### Find a parent ```bash //section[h1[@id='section-name']] ``` Finds a `
` that directly contains `h1#section-name` ```bash //section[//h1[@id='section-name']] ``` Finds a `
` that contains `h1#section-name`. (Same as above, but uses descendant-or-self instead of child) ### Closest ```bash ./ancestor-or-self::[@class="box"] ``` Works like jQuery's `$().closest('.box')`. ### Attributes ```bash //item[@price > 2@discount] ``` Finds `` and check its attributes References ---------- {: .-one-column} * [Xpath test bed](http://www.whitebeam.org/library/guide/TechNotes/xpathtestbed.rhtm) _(whitebeam.org)_