3 Highlight.js — это инструмент для подсветки синтаксиса, написанный на JavaScript. Он работает
4 и в браузере, и на сервере. Он работает с практически любой HTML разметкой, не
5 зависит от каких-либо фреймворков и умеет автоматически определять язык.
10 Минимум, что нужно сделать для использования highlight.js на веб-странице — это
11 подключить библиотеку, CSS-стили и вызывать [`initHighlightingOnLoad`][1]:
14 <link rel="stylesheet" href="/path/to/styles/default.css">
15 <script src="/path/to/highlight.pack.js"></script>
16 <script>hljs.initHighlightingOnLoad();</script>
19 Библиотека найдёт и раскрасит код внутри тегов `<pre><code>`, попытавшись
20 автоматически определить язык. Когда автоопределение не срабатывает, можно явно
21 указать язык в атрибуте class:
24 <pre><code class="html">...</code></pre>
27 Список поддерживаемых классов языков доступен в [справочнике по классам][2].
28 Класс также можно предварить префиксами `language-` или `lang-`.
30 Чтобы отключить подсветку для какого-то блока, используйте класс `nohighlight`:
33 <pre><code class="nohighlight">...</code></pre>
36 ## Инициализация вручную
38 Чтобы иметь чуть больше контроля за инициализацией подсветки, вы можете
39 использовать функции [`highlightBlock`][3] и [`configure`][4]. Таким образом
40 можно управлять тем, *что* и *когда* подсвечивать.
42 Вот пример инициализации, эквивалентной вызову [`initHighlightingOnLoad`][1], но
43 с использованием jQuery:
46 $(document).ready(function() {
47 $('pre code').each(function(i, block) {
48 hljs.highlightBlock(block);
53 Вы можете использовать любые теги разметки вместо `<pre><code>`. Если
54 используете контейнер, не сохраняющий переводы строк, вам нужно сказать
55 highlight.js использовать для них тег `<br>`:
58 hljs.configure({useBR: true});
60 $('div.code').each(function(i, block) {
61 hljs.highlightBlock(block);
65 Другие опции можно найти в документации функции [`configure`][4].
70 Подсветку можно запустить внутри web worker'а, чтобы окно
71 браузера не подтормаживало при работе с большими кусками кода.
76 addEventListener('load', function() {
77 var code = document.querySelector('#code');
78 var worker = new Worker('worker.js');
79 worker.onmessage = function(event) { code.innerHTML = event.data; }
80 worker.postMessage(code.textContent);
87 onmessage = function(event) {
88 importScripts('<path>/highlight.pack.js');
89 var result = self.hljs.highlightAuto(event.data);
90 postMessage(result.value);
95 ## Установка библиотеки
97 Highlight.js можно использовать в браузере прямо с CDN хостинга или скачать
98 индивидуальную сборку, а также установив модуль на сервере. На
99 [странице загрузки][5] подробно описаны все варианты.
101 **Не подключайте GitHub напрямую.** Библиотека не предназначена для
102 использования в виде исходного кода, а требует отдельной сборки. Если вам не
103 подходит ни один из готовых вариантов, читайте [документацию по сборке][6].
105 **Файл на CDN содержит не все языки.** Иначе он будет слишком большого размера.
106 Если нужного вам языка нет в [категории "Common"][5], можно дообавить его
110 <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.4.0/languages/go.min.js"></script>
113 **Про Almond.** Нужно задать имя модуля в оптимизаторе, например:
116 r.js -o name=hljs paths.hljs=/path/to/highlight out=highlight.js
122 Highlight.js распространяется под лицензией BSD. Подробнее читайте файл
128 Официальный сайт билиотеки расположен по адресу <https://highlightjs.org/>.
130 Более подробная документация по API и другим темам расположена на
131 <http://highlightjs.readthedocs.io/>.
133 Авторы и контрибьюторы перечислены в файле [AUTHORS.ru.txt][8] file.
135 [1]: http://highlightjs.readthedocs.io/en/latest/api.html#inithighlightingonload
136 [2]: http://highlightjs.readthedocs.io/en/latest/css-classes-reference.html
137 [3]: http://highlightjs.readthedocs.io/en/latest/api.html#highlightblock-block
138 [4]: http://highlightjs.readthedocs.io/en/latest/api.html#configure-options
139 [5]: https://highlightjs.org/download/
140 [6]: http://highlightjs.readthedocs.io/en/latest/building-testing.html
141 [7]: https://github.com/isagalaev/highlight.js/blob/master/LICENSE
142 [8]: https://github.com/isagalaev/highlight.js/blob/master/AUTHORS.ru.txt