UNPKG

7.65 kBMarkdownView Raw
1# unist-util-select
2
3[![Build][build-badge]][build]
4[![Coverage][coverage-badge]][coverage]
5[![Downloads][downloads-badge]][downloads]
6[![Size][size-badge]][size]
7[![Sponsors][sponsors-badge]][collective]
8[![Backers][backers-badge]][collective]
9[![Chat][chat-badge]][chat]
10
11[**unist**][unist] utility with equivalents for `querySelector`,
12`querySelectorAll`, and `matches`.
13
14Note that the DOM has references to their parent nodes, meaning that
15`document.body.matches(':last-child')` can be evaluated.
16This information is not stored in unist, so selectors like that don’t work.
17
18[View the list of supported selectors »][support]
19
20## Install
21
22[npm][]:
23
24```sh
25npm install unist-util-select
26```
27
28## API
29
30### `select.matches(selector, node)`
31
32Check that the given [node][] matches `selector`.
33Returns `boolean`, whether the node matches or not.
34
35This only checks the element itself, not the surrounding tree.
36Thus, nesting in selectors is not supported (`paragraph strong`,
37`paragraph > strong`), nor are selectors like `:first-child`, etc.
38This only checks that the given element matches the selector.
39
40```js
41var u = require('unist-builder')
42var matches = require('unist-util-select').matches
43
44matches('strong, em', u('strong', [u('text', 'important')])) // => true
45matches('[lang]', u('code', {lang: 'js'}, 'console.log(1)')) // => true
46```
47
48### `select.select(selector, tree)`
49
50Select the first node matching `selector` in the given `tree` (could be the
51tree itself).
52Returns the found [node][], if any.
53
54```js
55var u = require('unist-builder')
56var select = require('unist-util-select').select
57
58console.log(
59 select(
60 'code ~ :nth-child(even)',
61 u('blockquote', [
62 u('paragraph', [u('text', 'Alpha')]),
63 u('paragraph', [u('text', 'Bravo')]),
64 u('code', 'Charlie'),
65 u('paragraph', [u('text', 'Delta')]),
66 u('paragraph', [u('text', 'Echo')])
67 ])
68 )
69)
70```
71
72Yields:
73
74```js
75{type: 'paragraph', children: [{type: 'text', value: 'Delta'}]}
76```
77
78### `select.selectAll(selector, tree)`
79
80Select all nodes matching `selector` in the given `tree` (could include the
81tree itself).
82Returns all found [node][]s, if any.
83
84```js
85var u = require('unist-builder')
86var selectAll = require('unist-util-select').selectAll
87
88console.log(
89 selectAll(
90 'code ~ :nth-child(even)',
91 u('blockquote', [
92 u('paragraph', [u('text', 'Alpha')]),
93 u('paragraph', [u('text', 'Bravo')]),
94 u('code', 'Charlie'),
95 u('paragraph', [u('text', 'Delta')]),
96 u('paragraph', [u('text', 'Echo')]),
97 u('paragraph', [u('text', 'Foxtrot')]),
98 u('paragraph', [u('text', 'Golf')])
99 ])
100 )
101)
102```
103
104Yields:
105
106```js
107[
108 {type: 'paragraph', children: [{type: 'text', value: 'Delta'}]},
109 {type: 'paragraph', children: [{type: 'text', value: 'Foxtrot'}]}
110]
111```
112
113## Support
114
115* [x] `*` (universal selector)
116* [x] `,` (multiple selector)
117* [x] `paragraph` (type selector)
118* [x] `blockquote paragraph` (combinator: descendant selector)
119* [x] `blockquote > paragraph` (combinator: child selector)
120* [x] `code + paragraph` (combinator: adjacent sibling selector)
121* [x] `code ~ paragraph` (combinator: general sibling selector)
122* [x] `[attr]` (attribute existence, checks that the value on the tree is not
123 nullish)
124* [x] `[attr=value]` (attribute equality, this stringifies values on the tree)
125* [x] `[attr^=value]` (attribute begins with, only works on strings)
126* [x] `[attr$=value]` (attribute ends with, only works on strings)
127* [x] `[attr*=value]` (attribute contains, only works on strings)
128* [x] `[attr~=value]` (attribute contains, checks if `value` is in the array,
129 if there’s an array on the tree, otherwise same as attribute equality)
130* [x] `:any()` (functional pseudo-class, use `:matches` instead)
131* [x] `:has()` (functional pseudo-class)
132 Relative selectors (`:has(> img)`) are not supported, but `:scope` is
133* [x] `:matches()` (functional pseudo-class)
134* [x] `:not()` (functional pseudo-class)
135* [x] `:blank` (pseudo-class, blank and empty are the same: a parent without
136 children, or a node without value)
137* [x] `:empty` (pseudo-class, blank and empty are the same: a parent without
138 children, or a node without value)
139* [x] `:root` (pseudo-class, matches the given node)
140* [x] `:scope` (pseudo-class, matches the given node)
141* [x] \* `:first-child` (pseudo-class)
142* [x] \* `:first-of-type` (pseudo-class)
143* [x] \* `:last-child` (pseudo-class)
144* [x] \* `:last-of-type` (pseudo-class)
145* [x] \* `:only-child` (pseudo-class)
146* [x] \* `:only-of-type` (pseudo-class)
147* [x] \* `:nth-child()` (functional pseudo-class)
148* [x] \* `:nth-last-child()` (functional pseudo-class)
149* [x] \* `:nth-last-of-type()` (functional pseudo-class)
150* [x] \* `:nth-of-type()` (functional pseudo-class)
151
152###### Notes
153
154* \* — Not supported in `matches`
155
156## Related
157
158* [`unist-util-filter`](https://github.com/syntax-tree/unist-util-filter)
159 — Create a new tree with all nodes that pass a test
160* [`unist-util-map`](https://github.com/syntax-tree/unist-util-map)
161 — Create a new tree with all nodes mapped by a given function
162* [`unist-util-flatmap`](https://gitlab.com/staltz/unist-util-flatmap)
163 — Create a new tree by mapping (to an array) with the given function
164* [`unist-util-is`](https://github.com/syntax-tree/unist-util-is)
165 — Check if a node passes a test
166* [`unist-util-remove`](https://github.com/syntax-tree/unist-util-remove)
167 — Remove nodes from trees
168* [`unist-util-remove-position`](https://github.com/syntax-tree/unist-util-remove-position)
169 — Remove positional info from trees
170* [`unist-util-visit`](https://github.com/syntax-tree/unist-util-visit)
171 — Recursively walk over nodes
172* [`unist-util-visit-parents`](https://github.com/syntax-tree/unist-util-visit-parents)
173 — Like `visit`, but with a stack of parents
174* [`unist-builder`](https://github.com/syntax-tree/unist-builder)
175 — Helper for creating trees
176
177## Contribute
178
179See [`contributing.md` in `syntax-tree/.github`][contributing] for ways to get
180started.
181See [`support.md`][help] for ways to get help.
182
183This project has a [code of conduct][coc].
184By interacting with this repository, organization, or community you agree to
185abide by its terms.
186
187## License
188
189[MIT][license] © Eugene Sharygin
190
191<!-- Definitions -->
192
193[build-badge]: https://img.shields.io/travis/syntax-tree/unist-util-select.svg
194
195[build]: https://travis-ci.org/syntax-tree/unist-util-select
196
197[coverage-badge]: https://img.shields.io/codecov/c/github/syntax-tree/unist-util-select.svg
198
199[coverage]: https://codecov.io/github/syntax-tree/unist-util-select
200
201[downloads-badge]: https://img.shields.io/npm/dm/unist-util-select.svg
202
203[downloads]: https://www.npmjs.com/package/unist-util-select
204
205[size-badge]: https://img.shields.io/bundlephobia/minzip/unist-util-select.svg
206
207[size]: https://bundlephobia.com/result?p=unist-util-select
208
209[sponsors-badge]: https://opencollective.com/unified/sponsors/badge.svg
210
211[backers-badge]: https://opencollective.com/unified/backers/badge.svg
212
213[collective]: https://opencollective.com/unified
214
215[chat-badge]: https://img.shields.io/badge/chat-discussions-success.svg
216
217[chat]: https://github.com/syntax-tree/unist/discussions
218
219[npm]: https://docs.npmjs.com/cli/install
220
221[license]: license
222
223[contributing]: https://github.com/syntax-tree/.github/blob/HEAD/contributing.md
224
225[help]: https://github.com/syntax-tree/.github/blob/HEAD/support.md
226
227[coc]: https://github.com/syntax-tree/.github/blob/HEAD/code-of-conduct.md
228
229[unist]: https://github.com/syntax-tree/unist
230
231[node]: https://github.com/syntax-tree/unist#node
232
233[support]: #support