如何在使用highlight.js时指定语言

How to specify language when using highlight.js?

本文关键字:语言 js highlight      更新时间:2023-09-26

我使用highlight.js来突出显示HTML中的代码块。highlight.js可以找到所有代码块并自动确定语言,但我想手动指定元素和语言。通过指定语言,我想避免确定它是哪种语言的开销(虽然highlight.js很快,但如果它跳过语言检测,我想它可能会更快)。

在HTML中,我将语言指定为一个类(我需要它来样式化代码块)。

<pre>
<code class="python">
print "Hello"
</code>
</pre>

在JavaScript中,我遍历代码元素(由于某些其他原因,我需要获得这些元素的列表)。当我在代码元素上迭代时,我调用hljs.highlightBlock函数。因为我知道该语言(以类的形式存储),所以我认为告诉highlight.js应该高亮显示的语言将是有利的。

从highlight.js网站上的使用示例中,我猜我可以调用hljs.configure函数并指定要尝试的语言列表:

// ...
if (codeElement.hasClass('python'))
    language = 'python';
else if (codeElement.hasClass('bash'))
    language = 'bash';
hljs.configure({languages: [language]});
hljs.highlightBlock(codeElement[0]);

然而,我不确定这是否是正确的方法。首先,我不清楚这是否是一个我可以依赖的官方API。其次,我认为highlight.js仍然试图确定代码块是否在给定的语言中(这是我首先要避免的)。

您正在迭代'预代码'元素对吗?但是您在"code"标签中指定了语言,而不是"pre"标签。我也遇到了同样的问题,在最上面的元素上指定语言解决了这个问题。你的html代码应该像这样:

<pre class="python">
<code>
print "Hello"
</code>
</pre>

还要确保'python'包含在你正在使用的highlight.js包中:)