如何使用

筛选高亮全部为你提供筛选 highlightAll 和 highlightAllUnder 方法实际高亮的元素的方法。当你在加载页面时使用 Prism 的自动高亮但想要排除某些代码块时，这非常有用。

API

在 Prism.plugins.filterHighlightAll 中，你可以找到以下内容

add(condition: (value: { element, language: string }) => boolean): void
添加一个新的筛选条件，只有在给定的方法对此元素返回 true 时才会允许高亮此元素。
这可用于定义一个自定义语言筛选条件。
addSelector(selector: string): void
添加一个新的筛选条件，只有当元素与给定的 CSS 选择器匹配时才允许高亮此元素。
reject.add(condition: (value: { element, language: string }) => boolean): void
与 add 相同，但只高亮 不 满足条件的元素。
reject.addSelector(selector: string): void
与 addSelector 相同，但只高亮 不 匹配选择器的元素。
filterKnown: boolean = false
将此设置为 true 以仅允许已知语言。将不会高亮没有设置语言或语言未知的代码块。

只有当上述所有内容都接受此元素时，此元素才会被 highlightAll 和 highlightAllUnder 方法高亮。

属性

你还可以向包含筛选高亮全部插件的脚本添加以下 data-* 属性。

<script src="..." data-filter-selector="<css selector>">
此属性是 Prism.plugins.filterHighlightAll.addSelector 的简写。此属性的值将按原样传递给 addSelector 函数。
<script src="..." data-reject-selector="<css selector>">
此属性是 Prism.plugins.filterHighlightAll.reject.addSelector 的简写。此属性的值将按原样传递给 rejectSelector 函数。
<script src="..." data-filter-known>
此属性可用于设置 Prism.plugins.filterHighlightAll.filterKnown 的值。如果属性存在，则会将 filterKnown 设置为 true，否则设置为 false。

示例

以下代码用于在此页面上定义筛选条件。

// <code> elements with a .no-highlight class will be ignored
Prism.plugins.filterHighlightAll.reject.addSelector('code.no-highlight');
Prism.plugins.filterHighlightAll.reject.addSelector('pre.no-highlight > code');

// don't highlight CSS code
Prism.plugins.filterHighlightAll.add(function (env) {
	return env.language !== 'css';
});

结果

let foo = "I'm not being highlighted";
a.link::after {
	content: 'also not being highlighted';
	color: #F00;
}

Prism 将忽略这些块，因此你甚至可以定义自己的静态高亮，而 Prism 通常会删除这些高亮。

a.link::before {
	content: 'I just do my own highlighting';
	color: #F00;
}