Security News
Dutch National Police Disrupt Redline and Meta Malware Operations
Dutch National Police and FBI dismantle Redline and Meta infostealer malware-as-a-service operations in Operation Magnus, seizing servers and source code.
The css-what npm package is a CSS selector parser that translates CSS selectors into an easy-to-process format. It is often used in server-side applications or tools that need to interpret and manipulate CSS selectors programmatically.
Parsing CSS Selectors
This feature allows you to parse a CSS selector string into a structured format. The code sample demonstrates how to parse a complex CSS selector into an array of objects representing each part of the selector.
const parse = require('css-what');
const selector = 'div > .className[attr=value]';
const parsed = parse(selector);
console.log(parsed);
css-select is a CSS selector engine that uses css-what under the hood to parse selectors. It extends the parsing capabilities with selecting elements from a DOM tree, making it more suitable for tasks that involve DOM manipulation.
cheerio is a fast, flexible, and lean implementation of core jQuery designed specifically for the server. It uses css-what indirectly through css-select for parsing CSS selectors. Cheerio provides a full jQuery-like API for traversing and manipulating the DOM.
jsdom is a pure-JavaScript implementation of many web standards, notably the DOM and HTML standards. It allows you to interact with a DOM tree using standard DOM APIs. While jsdom does not use css-what directly, it provides similar functionality in terms of interpreting and applying CSS selectors to a DOM structure.
A CSS selector parser.
import * as CSSwhat from "css-what";
CSSwhat.parse("foo[bar]:baz")
~> [
[
{ type: "tag", name: "foo" },
{
type: "attribute",
name: "bar",
action: "exists",
value: "",
ignoreCase: null
},
{ type: "pseudo", name: "baz", data: null }
]
]
CSSwhat.parse(selector)
- Parses selector
.
The function returns a two-dimensional array. The first array represents selectors separated by commas (eg. sub1, sub2
), the second contains the relevant tokens for that selector. Possible token types are:
name | properties | example | output |
---|---|---|---|
tag | name | div | { type: 'tag', name: 'div' } |
universal | - | * | { type: 'universal' } |
pseudo | name , data | :name(data) | { type: 'pseudo', name: 'name', data: 'data' } |
pseudo | name , data | :name | { type: 'pseudo', name: 'name', data: null } |
pseudo-element | name | ::name | { type: 'pseudo-element', name: 'name' } |
attribute | name , action , value , ignoreCase | [attr] | { type: 'attribute', name: 'attr', action: 'exists', value: '', ignoreCase: false } |
attribute | name , action , value , ignoreCase | [attr=val] | { type: 'attribute', name: 'attr', action: 'equals', value: 'val', ignoreCase: false } |
attribute | name , action , value , ignoreCase | [attr^=val] | { type: 'attribute', name: 'attr', action: 'start', value: 'val', ignoreCase: false } |
attribute | name , action , value , ignoreCase | [attr$=val] | { type: 'attribute', name: 'attr', action: 'end', value: 'val', ignoreCase: false } |
child | - | > | { type: 'child' } |
parent | - | < | { type: 'parent' } |
sibling | - | ~ | { type: 'sibling' } |
adjacent | - | + | { type: 'adjacent' } |
descendant | - | { type: 'descendant' } | |
column-combinator | - | || | { type: 'column-combinator' } |
CSSwhat.stringify(selector)
- Turns selector
back into a string.
License: BSD-2-Clause
To report a security vulnerability, please use the Tidelift security contact. Tidelift will coordinate the fix and disclosure.
css-what
for enterpriseAvailable as part of the Tidelift Subscription
The maintainers of css-what
and thousands of other packages are working with Tidelift to deliver commercial support and maintenance for the open source dependencies you use to build your applications. Save time, reduce risk, and improve code health, while paying the maintainers of the exact dependencies you use. Learn more.
FAQs
a CSS selector parser
The npm package css-what receives a total of 24,290,956 weekly downloads. As such, css-what popularity was classified as popular.
We found that css-what demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Dutch National Police and FBI dismantle Redline and Meta infostealer malware-as-a-service operations in Operation Magnus, seizing servers and source code.
Research
Security News
Socket is tracking a new trend where malicious actors are now exploiting the popularity of LLM research to spread malware through seemingly useful open source packages.
Security News
Research
Noxia, a new dark web bulletproof host, offers dirt cheap servers for Python, Node.js, Go, and Rust, enabling cybercriminals to distribute malware and execute supply chain attacks.