AAA Главная
Примеры PHP Примеры JavaScript Примеры Ajax Примеры CSS,HTML

Подсветка javascript кода

Для тех кому не хочется использовать монстра hightlight.js предлагаю простой скрипт:

<style>
.S{color:red}/* Строки красные */
.func{color:blue}/* Юзер-функции синие */
.C{color:orange}/* Комменты оранжевые */
.kwrd{font-weight:bold}/* Ключевые слова полужирные */
.R{color:gray} /*Серые регвыражения */
.S span{color:red;font-weight:normal}/* Всё внутри строки — строка */
.C span{color:orange;font-weight:normal}/* Всё внутри комментария — комментарий */
</style>
<script>
function Syntax(code){
    var comments    = [];    // Тут собираем все каменты
    var strings        = [];    // Тут собираем все строки
    var res            = [];    // Тут собираем все RegExp
    var all            = { 'C': comments, 'S': strings, 'R': res };
    var safe        = { '<': '<', '>': '>', '&': '&' };

    return code
    // Маскируем HTML
        .replace(/[<>&]/g, function (m)
            { return safe[m]; })
    // Убираем коментарии
        .replace(/\/\*[\s\S]*\*\//g, function(m)
            { var l=comments.length; comments.push(m); return '~~~C'+l+'~~~';   })
        .replace(/([^\\])\/\/[^\n]*\n/g, function(m, f)
            { var l=comments.length; comments.push(m); return f+'~~~C'+l+'~~~'; })
    // Убираем regexp
        .replace(/\/(\\\/|[^\/\n])*\/[gim]{0,3}/g, function(m)
            { var l=res.length; res.push(m); return '~~~R'+l+'~~~';   })
    // Убираем строки
        .replace(/([^\\])((?:'(?:\\'|[^'])*')|(?:"(?:\\"|[^"])*"))/g, function(m, f, s)
            { var l=strings.length; strings.push(s); return f+'~~~S'+l+'~~~'; })
    // Выделяем ключевые слова
        .replace(/(var|function|typeof|new|return|if|for|in|while|break|do|continue|switch|case)([^a-z0-9\$_])/gi,
            '<span class="kwrd">$1</span>$2')
    // Выделяем скобки
        .replace(/(\{|\}|\]|\[|\|)/gi,
            '<span class="gly">$1</span>')
    // Выделяем имена функций
        .replace(/([a-z\_\$][a-z0-9_]*)[\s]*\(/gi,
            '<span class="func">$1</span>(')
    // Возвращаем на место коментарии, строки, RegExp
        .replace(/~~~([CSR])(\d+)~~~/g, function(m, t, i)
            { return '<span class="'+t+'">'+all[t][i]+'</span>'; })
    // Выставляем переводы строк
        .replace(/\n/g,    '<'+'br>')
    // Табуляцию заменяем неразрывными пробелами
        .replace(/\t/g, '&'+'nbsp;&'+'nbsp;&'+'nbsp;&'+'nbsp;');    // Выставляем переводы строк
}
</script>

.

© Copyright 2008- by KDG



Rambler's Top100