StackOverflow 中如何设置代码颜色？答案

【问题标题】：How Code Color is Set in StackOverflow?StackOverflow 中如何设置代码颜色？
【发布时间】：2008-10-25 06:03:40
【问题描述】：

StackOverflow 对我来说最喜欢的功能是它可以自动检测 post 中的代码并为代码设置适当的颜色。

我想知道颜色是如何设置的。当我在页面上执行 Ctrl+F5 时，代码似乎首先是黑色文本，然后变为彩色。是 jQuery 做的吗？

【问题讨论】：

【解决方案1】：

正如 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)

对于普通代码产生错觉来说足够好，并且比在浏览器中加载十几个语法更好。

【讨论】：

代码部分没有高亮显示？当然。只需将普通的、未缩进的文本块包装在 PRE 标记中，就像纯 HTML 一样。

【解决方案2】：

来自Stack Overflow Podcast #11：

阿特伍德：是的。好的，这来自于我认为是某个 Google 工程师编写的项目——它被称为“Prettify”。有趣的是，它实际上推断出所有的语法高亮，这听起来像是不可能的——如果你仔细想想，这听起来真的很疯狂。但它实际上有点工作。现在，他只支持它，有些方言不能很好地使用它，但是对于所有那种方言，你可以在谷歌上找到。我认为它来自谷歌的谷歌代码。它是实际代码，它是 Google Code 上的实际 JavaScript，它突出显示了当您在 Google Code 上托管项目时返回的代码。还有你，还有你，嗯，因为我认为他们使用 Subversion，所以你实际上可以点击...

Spolsky：他们怎么知道，他们怎么知道你写的是什么语言？因此，评论是什么以及...

阿特伍德：我不知道。这很疯狂。它是 prettify.js，所以如果有人对此感兴趣，只需在网络上搜索“prettify.js”，就会找到它。

您可以在这里找到 prettify.js：http://code.google.com/p/google-code-prettify/

【讨论】：

【解决方案3】：

回复..

Spolsky：他们怎么知道，他们怎么知道你写的是什么语言？

它没有。荧光笔非常愚蠢，但由于大多数编程语言非常相似，因此设法摆脱了它。几乎所有东西都使用足够接近的语法..

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! */

【讨论】：