Как цвет кода устанавливается в StackOverflow? - PullRequest
Новая
       8

Как цвет кода устанавливается в StackOverflow?

13 голосов
/ 25 октября 2008

Самая любимая функция StackOverflow для меня заключается в том, что он может автоматически определять код в записи и устанавливать соответствующий цвет для кода.

Мне интересно, как устанавливается цвет. Когда я делаю Ctrl + F5 на странице, код сначала отображается черным текстом, а затем меняется на цветной. Это сделано с помощью jQuery?

Ответы [ 3 ]

20 голосов
/ 25 октября 2008

С Подкаст переполнения стека # 11 :

Этвуд: Это так. Ладно, это так, это проект, который, как мне кажется, написал какой-то инженер Google - он называется «Prettify». И это немного интересно тем, что на самом деле он выводит всю подсветку синтаксиса, которая звучит так, как будто она не может работать - это звучит на самом деле безумно, если подумать. Но на самом деле это отчасти работает. Теперь он только поддерживает это, есть определенные диалекты, которые просто не очень хорошо с этим работают, но для всех диалектов такого рода вы найдете в Google. Я думаю, что это происходит из Google Code Google. Это фактический код, это фактический JavaScript в Google Code, который подчеркивает тот код, который возвращается, когда вы размещаете проекты в Google Code. И вы, и вы, потому что я думаю, что они используют Subversion, чтобы вы могли на самом деле нажать ...

Спольский: Откуда они знают, как они вообще знают, на каком языке вы пишете? И поэтому, что за комментарий и ...

Этвуд: Я не знаю. Это безумие. Это prettify.js, поэтому, если кому-то интересно посмотреть на это, просто выполните поиск в Интернете по запросу «prettify.js», и вы найдете его.

А вот здесь вы можете найти prettify.js: http://code.google.com/p/google-code-prettify/

11 голосов
/ 25 октября 2008

В ответ на ..

Спольский: Откуда они знают, как они вообще знают, на каком языке вы пишете?

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

AFunction("a string")
1 + 4 # <- numbers
      #     /\ a comment
      // also a comment..

.. что большинство вещей выделяется правильно. Вышесказанное не является актуальным языком программирования, но оно прекрасно подчеркивает.

Существуют исключения, например, иногда он может трактовать / как начало регулярного выражения (как в Perl / Ruby). когда это не так: 

this [^\s>/] # is highlighted as a regex, not a comment

.. но это довольно редко, и он хорошо справляется с большинством вещей, например .. 

/*
this is a multi-line comment
"with a string" =~ /and a regex/
*/
but =~ /this is a regex with a [/*] multiline comment
markers in it! */
3 голосов
/ 25 октября 2008

Как сказал dbr, он делает фиктивную подсветку наиболее распространенных конструкций языков. Что не очень хорошо работает с некоторыми экзотическими синтаксисами. Интересно, можем ли мы сделать фрагменты кода без выделения, кстати? 

For id = 1 To 10 Do
  CallSomething() // It likes CamelCase identifiers...
End

for id = 1 to 10 do # Also highlight some common keywords...
  if id % 2 then call_something(); x++; end
end

'str' "str" 12 + 15.6 * -7e+9 /* Some common constant forms */
=/regex/ ~/regex/ +/RE/ !/regexpr/ but not /[^regex]/ (no operator before it)

(* Some comment conventions are overlooked... *)
-- Lua's (and some other languages')
; So are these comments...
' And these (Basic)

Работает достаточно хорошо для обычного кода, чтобы создать иллюзию, и лучше, чем загружать дюжину синтаксисов в браузере.

...