https://github.com/ryanmorr/parselector
Parse a CSS selector string
https://github.com/ryanmorr/parselector
css css-selector javascript parser
Last synced: 10 months ago
JSON representation
Parse a CSS selector string
- Host: GitHub
- URL: https://github.com/ryanmorr/parselector
- Owner: ryanmorr
- License: unlicense
- Created: 2019-02-15T20:02:33.000Z (almost 7 years ago)
- Default Branch: master
- Last Pushed: 2024-10-22T15:49:50.000Z (over 1 year ago)
- Last Synced: 2025-04-09T16:09:35.192Z (10 months ago)
- Topics: css, css-selector, javascript, parser
- Language: JavaScript
- Homepage:
- Size: 196 KB
- Stars: 4
- Watchers: 1
- Forks: 2
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# parselector
[![Version Badge][version-image]][project-url]
[![License][license-image]][license-url]
[![Build Status][build-image]][build-url]
> Parse a CSS selector string
## Install
Download the [CJS](https://github.com/ryanmorr/parselector/raw/master/dist/cjs/parselector.js), [ESM](https://github.com/ryanmorr/parselector/raw/master/dist/esm/parselector.js), [UMD](https://github.com/ryanmorr/parselector/raw/master/dist/umd/parselector.js) versions or install via NPM:
```sh
npm install @ryanmorr/parselector
```
## Usage
Provide a selector string and get a two-dimensional array composed of each selector group in the first array and the tokens for a selector sequence in the second array.
```javascript
import parselector from '@ryanmorr/parselector';
parselector('#foo[attr$="value" i] > div:not(.bar), .baz span::before');
```
Generates the following AST structure:
```javascript
[
[
{
nodeName: null,
attributes: [
{
name: 'id',
operator: '=',
value: 'foo',
ignoreCase: false
},
{
name: 'attr',
operator: '$=',
value: 'value',
ignoreCase: true
}
],
pseudoClasses: [],
pseudoElement: null
},
'>',
{
nodeName: 'div',
attributes: [],
pseudoClasses: [
{
name: 'not',
value: '.bar'
}
],
pseudoElement: null
}
],
[
{
nodeName: null,
attributes: [
{
name: 'class',
operator: '~=',
value: 'baz',
ignoreCase: false
}
],
pseudoClasses: [],
pseudoElement: null
},
' ',
{
nodeName: 'span',
attributes: [],
pseudoClasses: [],
pseudoElement: 'before'
}
]
]
```
## License
This project is dedicated to the public domain as described by the [Unlicense](http://unlicense.org/).
[project-url]: https://github.com/ryanmorr/parselector
[version-image]: https://img.shields.io/github/package-json/v/ryanmorr/parselector?color=blue&style=flat-square
[build-url]: https://github.com/ryanmorr/parselector/actions
[build-image]: https://img.shields.io/github/actions/workflow/status/ryanmorr/parselector/node.js.yml?style=flat-square
[license-image]: https://img.shields.io/github/license/ryanmorr/parselector?color=blue&style=flat-square
[license-url]: UNLICENSE