Как работает подсветка синтаксиса?
Всем привет!
Вопрос такой: как работают библиотеки подсветки синтаксиса?
Перепробовал уже несколько библиотек - все работает, но вот в принципе их работы никак не могу разобраться.
В целях учебы решил написать свой небольшой парсер для php кода.
Делаю так:
1) код отрисовывается в <pre class="php">...</pre>
2) нахожу этот тег и беру у него pre.textContent
3) дальше при помощи str.replace ищу например переменные и обрамляю их в <span class="phpVar">переменная</span>
4) в итоге получаю строку в которой все переменные помещены в спаны
И вот тут у меня затык. По идее, я этой строкой должен заменить содержимое pre с кодом. Но как это сделать?
Если очистить тег pre и добавить строку через createTextNode, то все теги span видны как есть. Поэтому приходится очищать исходный тег и делать в него innerHTML.
Другого варианта не вижу. Только если парсить получившуюся строку и добавлять ее как положено в дерево.
|