Fork me on GitHub

highlight.js 代码高亮插件

官网:https://highlightjs.org/
API:http://highlightjs.readthedocs.org/en/latest/api.html

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>块包裹的代码。

3. 自动高亮代码

hljs.highlightAuto(code).value;

code为代码字符串,不能包含 html 代码,执行返回值为高亮 html 代码。

4. 手动高亮

hljs.initHighlighting.called = false;
hljs.initHighlighting();

如果我们不想页面加载后代码高亮,而是 ajax 读取 html 代码后,对此进行高亮,需要执行上面的代码。

参考资料:http://www.mojidong.com/html/css/js/2013/04/03/code-highlight/

posted @   田园里的蟋蟀  阅读(2731)  评论(0编辑  收藏  举报
编辑推荐:
· 10年+ .NET Coder 心语,封装的思维:从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热?
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
阅读排行:
· 10年+ .NET Coder 心语 ── 封装的思维:从隐藏、稳定开始理解其本质意义
· 地球OL攻略 —— 某应届生求职总结
· 提示词工程——AI应用必不可少的技术
· Open-Sora 2.0 重磅开源!
· 周边上新:园子的第一款马克杯温暖上架
历史上的今天:
2014-02-14 小菜学习Winform(五)窗体间传递数据
点击右上角即可分享
微信分享提示