hide-if-contains-and-matches-style

The hide-if-contains-and-matches-style snippet hides any HTML element (or its ancestors) that matches a CSS selector if the element's text content contains a given string and, optionally, if the element's computed style contains a given string.

Parameters

Name	Description	Mandatory
search	The string to look for in HTML elements. Enclose in `/` for regex.	Yes
selector	The CSS selector that an HTML element must match to be hidden.	Yes
`searchSelector`	CSS selector for elements containing the string. Defaults to `selector`.	No
style	The string that the computed style of the matching element must contain.	No
`searchStyle`	The string the computed style of `searchSelector` must contain.	No
`waitUntil`	Delay until given state is reached (loading, interactive, complete, load, or event name).	No
`windowWidthMin`	Disable if window.innerWidth is smaller than this value.	No
`windowWidthMax`	Disable if window.innerWidth is greater than this value.	No

Filter examples

Filter	Result
`hide-if-contains-and-matches-style FAQ nav`	Hides any `nav` element whose text contains "FAQ".
`hide-if-contains-and-matches-style FAQ nav a`	Hides `nav` with an `a` element containing "FAQ".
`hide-if-contains-and-matches-style FAQ nav a 'color: blue'`	Hides `nav` with `color: blue` and an `a` with "FAQ".
`hide-if-contains-and-matches-style FAQ nav a 'color: blue' 'display: inline'`	Hides `nav` with color blue and `a` with FAQ whose display is inline.