有你在真好 的个人博客
前端开发:一个语法高亮显示的JavaScript插件(highlight.js)
阅读:2244 添加日期:2021/3/27 23:23:16 原文链接:https://www.toutiao.com/item/6478143558611108365/

highlight.js是一个开源(BSD协议)的语法高亮显示插件,支持176中语言高亮显示(如Java、C++、C#、GO、PHP、Python等)、79中风格,支持自动检测语言,适用于任何标记,与任何js框架兼容,不依赖于任何框架。

1、快速开始

https://github.com/isagalaev/highlight.js

下载完成后解压,把解压后的文件放到项目任意位置,在页面中引入任意一种风格和highlight.pack.js。

前端开发:一个语法高亮显示的JavaScript插件(highlight.js)

在body中创建元素,highlight.js会自动检测语言,如果无法检测出正确语言,请使用class属性设置语言。

<pre><code class="java">代码</code></pre>

运行一下脚本初始化即可,不需要任何其他代码一个高亮显示就做好了。

<script>hljs.initHighlightingOnLoad();</script>

前端开发:一个语法高亮显示的JavaScript插件(highlight.js)

2、风格展示

①solarized-dark

前端开发:一个语法高亮显示的JavaScript插件(highlight.js)

②solarized-light

前端开发:一个语法高亮显示的JavaScript插件(highlight.js)

③railscasts

前端开发:一个语法高亮显示的JavaScript插件(highlight.js)

④monokai-sublime

前端开发:一个语法高亮显示的JavaScript插件(highlight.js)

⑤vs

前端开发:一个语法高亮显示的JavaScript插件(highlight.js)

⑥github

前端开发:一个语法高亮显示的JavaScript插件(highlight.js)

⑦color-brewer

前端开发:一个语法高亮显示的JavaScript插件(highlight.js)

⑧zenburn

前端开发:一个语法高亮显示的JavaScript插件(highlight.js)

3、语言展示

①swift

前端开发:一个语法高亮显示的JavaScript插件(highlight.js)

②css

前端开发:一个语法高亮显示的JavaScript插件(highlight.js)

③go

前端开发:一个语法高亮显示的JavaScript插件(highlight.js)

④typescript

前端开发:一个语法高亮显示的JavaScript插件(highlight.js)

⑤json

前端开发:一个语法高亮显示的JavaScript插件(highlight.js)

⑥python

前端开发:一个语法高亮显示的JavaScript插件(highlight.js)

⑦xml

前端开发:一个语法高亮显示的JavaScript插件(highlight.js)

⑧javascript

前端开发:一个语法高亮显示的JavaScript插件(highlight.js)


有哪里写得不好的地方请大家提出来,请轻喷,谢谢。 同时有什么与编程相关的好东西可以推举给我,再次感谢!

ICP备案号:苏ICP备14035786号-1 苏公网安备 32050502001014号