Projet

Général

Profil

Paste
Télécharger (7,42 ko) Statistiques
| Branche: | Révision:

root / drupal7 / sites / all / libraries / highlightjs / README.ru.md @ 4b706e38

1
# Highlight.js
2

    
3
Highlight.js нужен для подсветки синтаксиса в примерах кода в блогах,
4
форумах и вообще на любых веб-страницах. Пользоваться им очень просто,
5
потому что работает он автоматически: сам находит блоки кода, сам
6
определяет язык, сам подсвечивает.
7

    
8
Автоопределением языка можно управлять, когда оно не справляется само (см.
9
дальше "Эвристика").
10

    
11

    
12
## Простое использование
13

    
14
Подключите библиотеку и стиль на страницу и повесть вызов подсветки на
15
загрузку страницы:
16

    
17
```html
18
<link rel="stylesheet" href="styles/default.css">
19
<script src="highlight.pack.js"></script>
20
<script>hljs.initHighlightingOnLoad();</script>
21
```
22

    
23
Весь код на странице, обрамлённый в теги `<pre><code> .. </code></pre>`
24
будет автоматически подсвечен. Если вы используете другие теги или хотите
25
подсвечивать блоки кода динамически, читайте "Инициализацию вручную" ниже.
26

    
27
- Вы можете скачать собственную версию "highlight.pack.js" или сослаться
28
  на захостенный файл, как описано на странице загрузки:
29
  <http://highlightjs.org/download/>
30

    
31
- Стилевые темы можно найти в загруженном архиве или также использовать
32
  захостенные. Чтобы сделать собственный стиль для своего сайта, вам
33
  будет полезен справочник классов в файле [classref.txt][cr], который тоже
34
  есть в архиве.
35

    
36
[cr]: http://github.com/isagalaev/highlight.js/blob/master/classref.txt
37

    
38

    
39
## node.js
40

    
41
Highlight.js можно использовать в node.js. Библиотеку со всеми возможными языками можно
42
установить с NPM:
43

    
44
    npm install highlight.js
45

    
46
Также её можно собрать из исходников с только теми языками, которые нужны:
47

    
48
    python3 tools/build.py -tnode lang1 lang2 ..
49

    
50
Использование библиотеки:
51

    
52
```javascript
53
var hljs = require('highlight.js');
54

    
55
// Если вы знаете язык
56
hljs.highlight(lang, code).value;
57

    
58
// Автоопределение языка
59
hljs.highlightAuto(code).value;
60
```
61

    
62

    
63
## AMD
64

    
65
Highlight.js можно использовать с загрузчиком AMD-модулей.  Для этого его
66
нужно собрать из исходников следующей командой:
67

    
68
```bash
69
$ python3 tools/build.py -tamd lang1 lang2 ..
70
```
71

    
72
Она создаст файл `build/highlight.pack.js`, который является загружаемым
73
AMD-модулем и содержит все выбранные при сборке языки. Используется он так:
74

    
75
```javascript
76
require(["highlight.js/build/highlight.pack"], function(hljs){
77

    
78
  // Если вы знаете язык
79
  hljs.highlight(lang, code).value;
80

    
81
  // Автоопределение языка
82
  hljs.highlightAuto(code).value;
83
});
84
```
85

    
86

    
87
## Замена TABов
88

    
89
Также вы можете заменить символы TAB ('\x09'), используемые для отступов, на
90
фиксированное количество пробелов или на отдельный `<span>`, чтобы задать ему
91
какой-нибудь специальный стиль:
92

    
93
```html
94
<script type="text/javascript">
95
  hljs.tabReplace = '    '; // 4 spaces
96
  // ... or
97
  hljs.tabReplace = '<span class="indent">\t</span>';
98

    
99
  hljs.initHighlightingOnLoad();
100
</script>
101
```
102

    
103

    
104
## Инициализация вручную
105

    
106
Если вы используете другие теги для блоков кода, вы можете инициализировать их
107
явно с помощью функции `highlightBlock(code, tabReplace, useBR)`. Она принимает
108
DOM-элемент с текстом расцвечиваемого кода и опционально - строчку для замены
109
символов TAB.
110

    
111
Например с использованием jQuery код инициализации может выглядеть так:
112

    
113
```javascript
114
$(document).ready(function() {
115
  $('pre code').each(function(i, e) {hljs.highlightBlock(e)});
116
});
117
```
118

    
119
`highlightBlock` можно также использовать, чтобы подсветить блоки кода,
120
добавленные на страницу динамически. Только убедитесь, что вы не делаете этого
121
повторно для уже раскрашенных блоков.
122

    
123
Если ваш блок кода использует `<br>` вместо переводов строки (т.е. если это не
124
`<pre>`), передайте `true` третьим параметром в `highlightBlock`:
125

    
126
```javascript
127
$('div.code').each(function(i, e) {hljs.highlightBlock(e, null, true)});
128
```
129

    
130

    
131
## Эвристика
132

    
133
Определение языка, на котором написан фрагмент, делается с помощью
134
довольно простой эвристики: программа пытается расцветить фрагмент всеми
135
языками подряд, и для каждого языка считает количество подошедших
136
синтаксически конструкций и ключевых слов. Для какого языка нашлось больше,
137
тот и выбирается.
138

    
139
Это означает, что в коротких фрагментах высока вероятность ошибки, что
140
периодически и случается. Чтобы указать язык фрагмента явно, надо написать
141
его название в виде класса к элементу `<code>`:
142

    
143
```html
144
<pre><code class="html">...</code></pre>
145
```
146

    
147
Можно использовать рекомендованные в HTML5 названия классов:
148
"language-html", "language-php". Также можно назначать классы на элемент
149
`<pre>`.
150

    
151
Чтобы запретить расцветку фрагмента вообще, используется класс "no-highlight":
152

    
153
```html
154
<pre><code class="no-highlight">...</code></pre>
155
```
156

    
157

    
158
## Экспорт
159

    
160
В файле export.html находится небольшая программка, которая показывает и дает
161
скопировать непосредственно HTML-код подсветки для любого заданного фрагмента кода.
162
Это может понадобится например на сайте, на котором нельзя подключить сам скрипт
163
highlight.js.
164

    
165

    
166
## Координаты
167

    
168
- Версия: 7.5
169
- URL:    http://highlightjs.org/
170

    
171
Лицензионное соглашение читайте в файле LICENSE.
172
Список авторов и соавторов читайте в файле AUTHORS.ru.txt