`

SyntaxHighlighter代码高亮显示插件

    博客分类：
  • UI
CSSJavaScriptXMLHTML 
阅读更多

SyntaxHighlighter代码高亮显示  

主页地址：http://alexgorbatchev.com/SyntaxHighlighter/

 

最新版本为3.0.83：去掉了代码复制粘贴的动画

 

使用方法：

（1)导入核心js

<script type="text/javascript" src="scripts/shCore.js"></script>

   导入核心css

<link type="text/css" rel="stylesheet" href="styles/shCore.css"/>
<link type="text/css" rel="stylesheet" href="styles/shThemeDefault.css"/>

   导入所需js，如支持xml的js

<script type="text/javascript" src="scripts/shBrushXml.js"></script>

 （2）添加如下代码

<script type="text/javascript">
  SyntaxHighlighter.config.clipboardSwf = 'scripts/clipboard.swf';
  SyntaxHighlighter.all();
</script>

 其中最新版本为3.0.83不需要添加

SyntaxHighlighter.config.clipboardSwf = 'scripts/clipboard.swf';

html页面使用方法

<pre class="brush:xml;">
<xml>不显示
需要将< 换成 &lt;
</pre>

 

若想使高亮对textarea生效，添加

  SyntaxHighlighter.config.tagName='textarea';

html页面

<textarea name="code" id="code" class="brush:xml" rows="15" cols="100">
<html>
</html>
</textarea>
 

但这时如果通过js无法获取textarea的值，也即document.getElementById("code")的值为空。

 

分享到：
| jqplot插件绘图
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

Magicbox
Global site tag (gtag.js) - Google Analytics