highlight 介绍
在网页使用过程中,经常会用到 代码 的展示。而不同颜色的 代码 ,可以让 代码 看起来更直观,也更美观,highlight.js是一款轻量级的Web 代码 语法高亮库。
1.使用
其实官网已经有说明,这里简单说明下, 调用 方式:
<link rel="stylesheet" href="/path/to/styles/default.css">
<script src="/path/to/highlight.pack.js"></script>
<script>hljs.initHighlightingOnLoad();</script>
默 认高亮<pre><code></code></pre>块包裹的 代码 ,initHighlightingOnLoad是在 页面 加载时执行。
2. 定制
$(document).ready(function() {
$('pre code').each(function(i,e) {hljs.highlightBlock(e)});
});
自定义 高亮<pre><code></code></pre>块包裹的 代码 。但是我的 博客 园中 代码 查看了没有code 标签 ,所有定制的时候是这样:
$(document).ready(function() {
$('pre').each(function(i,e) {hljs.highlightBlock(e)});
});
3. 自动 高亮 代码
hljs.highlightAuto(code).value;code为 代码 字符串,不能包含 html 代码 ,执行返回值为高亮 html 代码 。4. 手动高亮
hljs.initHighlighting.called = false;hljs.initHighlighting();如果我们不想 页面 加载后 代码高亮 ,而是 ajax 读取 html 代码 后,对此进行高亮,需要执行上面的 代码 。 链接 : http://www.fly63.com/nav/29网站地址 : https://highlightjs.org/
GitHub: https://github.com/isagalaev/highlight.js
网站描述: Highlight.js 是 一个 用 JavaScript 写的 代码高亮 插件 ,在客户端和服务端都能工作。
highlight官方网站
官方网站: https://highlightjs.org/
如果觉得 网站内容还不错,欢迎将 网站 推荐给程序员好友。