HighlightRegistry

Интерфейс HighlightRegistry API CSS Custom Highlight API используется для регистрации объектов Highlight, которые будут форматироваться с помощью API. К нему можно получить доступ через CSS.highlights.

Экземпляр HighlightRegistry — это объект, подобный объекту Map, в котором каждый ключ — строка имени настраиваемого выделения, а соответствующее значение — связанный объект Highlight.

Интерфейс HighlightRegistry не наследует никаких свойств.

HighlightRegistry.size Только для чтения

Возвращает количество объектов Highlight , зарегистрированных в настоящее время.

Интерфейс HighlightRegistry не наследует никаких методов.

HighlightRegistry.clear()

Удаляет все объекты Highlight из реестра.

HighlightRegistry.delete()

Удаляет объект Highlight с заданным именем из реестра.

HighlightRegistry.entries()

Возвращает новый объект итератора, содержащий каждый объект Highlight в реестре в порядке добавления.

HighlightRegistry.forEach()

Вызывает заданную функцию обратного вызова один раз для каждого объекта Highlight в реестре в порядке добавления.

HighlightRegistry.get()

Получает объект Highlight с заданным именем из реестра.

HighlightRegistry.has()

Возвращает логическое значение, указывающее, присутствует ли объект Highlight в реестре.

HighlightRegistry.keys()

Псевдоним для HighlightRegistry.values().

HighlightRegistry.set()

Добавляет заданный объект Highlight в реестр с заданным именем или обновляет объект Highlight с заданным именем, если он уже существует в реестре.

HighlightRegistry.values()

Возвращает новый объект итератора, который возвращает объекты Highlight в реестре в порядке добавления.

Следующий пример демонстрирует, как создать диапазоны, создать новый объект Highlight для них и зарегистрировать выделение с помощью HighlightRegistry, чтобы отформатировать его на странице:

HTML

<p id="foo">CSS Custom Highlight API</p>

CSS

::highlight(my-custom-highlight) {
  background-color: peachpuff;
}

JavaScript

const text = document.getElementById("foo").firstChild;

if (!CSS.highlights) {
  text.textContent =
    "The CSS Custom Highlight API is not supported in this browser!";
}

// Create a couple of ranges.
const range1 = new Range();
range1.setStart(text, 0);
range1.setEnd(text, 3);

const range2 = new Range();
range2.setStart(text, 21);
range2.setEnd(text, 24);

// Create a custom highlight for these ranges.
const highlight = new Highlight(range1, range2);

// Register the ranges in the HighlightRegistry.
CSS.highlights.set("my-custom-highlight", highlight);

Результат

• CSS Custom Highlight API
• CSS Custom Highlight API: Возможности выделения диапазонов текста на веб-страницах