官网地址:https://highlightjs.org/

选择你需要的语言,点击下载,之后得到一个压缩包,在网页引入highlight.min.js文件和styles目录挑选一个样式引入

<!--引入文件-->
<link rel="stylesheet" href="/path/to/styles/default.min.css">
<script type="text/javascript" src="/Highlight/highlight.min.js"></script>
<script>hljs.highlightAll();</script>

现在应该可以正常工作了,但是我的不行,因为UEditor的规则,改写编辑器当然太麻烦了,所以

document.addEventListener('DOMContentLoaded', (event) => {
  document.querySelectorAll('.aobo pre').forEach((el) => {
    hljs.highlightElement(el);
  });
});

这样就可以指定aobo样式下的pre中的样式,自动识别的。

这个不支持ie浏览器,还有其他选择比如prettify.js等

然后有个插件可以设置序号,地址:https://github.com/wcoder/highlightjs-line-numbers.js/,本站就是用的这个,可以右键查看源码。


感谢您对我们公司的关注

如果您有任何疑问或想了解更多详细信息,请随时联系我们,我们很乐意为您提供支持和建议。