Как применить подсветку к контенту, измененному с помощью highlight.js и contenteditable = true в HTML? - PullRequest
0 голосов
/ 21 октября 2019

Я пытаюсь создать фрагмент кода, который можно редактировать, сохраняя выделение. Для поддержки подсветки я использую highlight.js. Это код, который я пытаюсь:

<pre>
  <code class="sql" contenteditable="true" id="my-code">
    SELECT * FROM my_table WHERE id = 1 AND s = 'qwe'
  

1 Ответ

0 голосов
/ 21 октября 2019

Когда вам нужно немного больше контроля над инициализацией highlight.js, вы можете использовать highlightBlock и настраивать функции. Это позволяет вам контролировать, что выделять и когда.

Вот эквивалентный способ вызова initHighlightingOnLoad с использованием vanilla JS:

document.addEventListener('DOMContentLoaded', (event) => {
  document.querySelectorAll('pre code').forEach((block) => {
    hljs.highlightBlock(block);
  });
});

Я только что скопировал с официального сайта, надеюсь, это поможет

...