简单 基于jQuery 语法高亮显示 高亮显示

  • 源码大小:33.55KB
  • 所需积分:1积分
  • 源码编号:19JP-3536
  • 浏览次数:262次
  • 最后更新:2023年06月24日
  • 所属栏目:文本
我要下载
加入收藏
本站默认解压密码:19jp.com 或 19jp_com

简介

Highlight是一个使用jQuery构建的简单语法高亮器,它可以让你的Html、CSS、PHP、Javascript和SQL片段看起来既漂亮又干净。

参见:

  • Prism-很棒的新语法荧光笔
  • 轻量级jQuery语法高亮显示插件-Liteblighter

如何使用它:

1.在你的网页首页部分包含核心风格。

<link rel="stylesheet" href="jquery.highlight.css">

2.在网页末尾包含jQuery库和jQuery突出显示插件。

<script src="/path/to/cdn/jquery.min.js"></script>
<script src="/path/to/jquery.highlight.js"></script>

3.使用创建代码段之前标签使用数据语言属性来指定代码语言。可用语言:js、sql、html、css和php。

<pre class="code" data-language="js">
  Your code snippet goes here.
</pre>

4.使用默认设置调用highlight()JavaScript方法。

$(document).ready(function(){
  $('pre.code').highlight();
});

5.具有默认值的可用设置。

$('pre.code').highlight({

  // show source code tab
  source: true,

  // show zebra
  zebra: true,

  //indents: "tabs" or "space"  
  indent: 'tabs',

  //ordered or unordered list
  list: 'ol',

  //name of the tag attribute to add a special language highlighting
  attribute: 'lang'
  
});

更新日志:

2022-06-07

  • JS已更新

2015-02-11

  • PHP中的注释解析不正确

预览截图