Простая подсветка кода на сайт

Эта запись написана мною в 2014 году. В те времена деревья были высокими, а доллар стоил меньше 40 рублей. С тех пор прошло много времени и многое изменилось. Учитывайте это, читая.

После обновления блога мне показалось, что будет намного удобнее в блоках с кодом ввести подсветку синтаксиса.

Погуглив, я нашёл множество больших готовых решений, но мне они все показались излишними. Ведь нужно просто сделать код на страницах немного более читабельным, но если нужна полноценная подсветка синтаксиса — любому удобнее будет скопировать код в свой любимый редактор.

Поэтому я решил написать свою простую подсветку кода в блоках на JavaScript, она будет работать для html, css, php, js.

UPD 05.01.2016: Я разработал плагин для WordPress, который вы можете использовать. Читать подробнее

Что бы скрипту было понятно где какой код, его нужно оборачивать в специальные блоки:

<pre class="php">КОД</pre>
<pre class="html">КОД</pre>
<pre class="css">КОД</pre>
<pre class="js">КОД</pre>

Так же, если это html код (ну или там просто встречаются теги), их нужно преобразовывать в специальные символы. Хотя это вроде и так понятно, иначе теги просто не будут видны, ибо браузер их обработает как теги. UDP: В новой версии скрипта это уже не обязательно, он всё сделает за вас.

Работает скрипт на основе регулярных выражений, просто оборачивая нужные символы в span теги для соответствующей окраски. Он делает это не идеально, присутствуют различные баги, но с задачей в общем случае справляется — цель скрипта просто сделать код, размещаемый в блоге, читабельным

Код скрипта и пример использования вы можете взять на github.

Пример его работы вы видите на моём блоге.
Хуже всего подсветка реализована для JavaScript, т.к. я мало пишу на нём, для html, css и php более-менее. Со временем буду дорабатывать и выкладывать тут информацию об обновлениях.

UPD 13.07.2014: Теперь скрипт сам заменит html символы < и > на соответствующие им, чтобы их можно было корректно вывести. Предварительная обработка не обязательна.

UPD 20.07.2014: Введена поддержка html кода в PHP блоках, теперь при смешении html и php кода подсвечивается и тот, и другой (в PHP блоках).

UPD 24.07.2014: Исправлен баг, если в блоках с PHP кодом не встречается блоков <?php —КОД— ?>, то весь блок подсвечивается по PHP правилам.