SyntaxHighlighter 語法高亮插件的使用教程

2024-09-06 19:16:41

字體：大中小

來源：轉載

供稿：網友

首先到這里下載其源碼。里面東西挺多的，我們基本上可以把它放到兩個文件夾就是。其中shCore.js與shCore.js與clipboard.swf放到js文件夾中，shCore.css還有另一個CSS文件（隨你挑一個吧）與所有圖片放到style文件夾中。如果你想高亮html或xml代碼，那么就在js多放一個shBrushXml.js，如果要高亮javascript代碼，就要多加一個shBrushJScript.js代碼。最后就是在我們的網頁上引用它們。

復制代碼代碼如下:

<link type="text/css" rel="stylesheet" href="style/shCore.css"/> 
<link type="text/css" rel="stylesheet" href="style/shThemeRDark.css"/> 
<script src="js/shCore.js" type="text/javascript" ></script> 
<script src="js/shBrushJScript.js" type="text/javascript" ></script> 
<script src="js/shBrushCss.js" type="text/javascript" ></script> 
<script src="js/shBrushXml.js" type="text/javascript" ></script>

然后再在頁面上新建一個script標簽，在里面添加代碼，進行配置與調用那個flash文件。

復制代碼代碼如下:

 
SyntaxHighlighter.config.clipboardSwf = 'js/clipboard.swf'; 
SyntaxHighlighter.all(); 

這些代碼是無需放于window.onload中的。再最后是如何使用，把要高亮的代碼放于一個pre文件中，這些代碼記得要事先處理，把<變成<，把>變成>。然后添加一個特殊的類型，brush加引號加上你們的代碼的類型。如要高亮javascript則要class="brush:javascript"，高亮css則要class="brush:css"。當然成功與否還在于你是否引進相關的javascript文件（指shBrushJScript.js等）

注意，這時代碼不但只高亮了，還會多出行號與工具欄，這就要更細致的配置。它們都在那個類名上做手腳，如把行號禁止了，就要class="brush:javascript;gutter:false;"。

這些參數具體可見這里

復制代碼代碼如下:

<pre class="brush:javascript;gutter:false;toolbar:false"> 
dom.ready(function(){ 
test("dom.ready"); 
}); 
</pre>

上一篇：fckeditor 修改記錄添加行距功能插件

下一篇：javascript 在線文本編輯器實現代碼

學習交流

如何查找有故障的配件

如何查找有故障的配件...

熱門圖片

猜你喜歡的新聞

猜你喜歡的關注

国产探花免费观看_亚洲丰满少妇自慰呻吟_97日韩有码在线_资源在线日韩欧美_一区二区精品毛片,辰东完美世界有声小说,欢乐颂第一季,yy玄幻小说排行榜完本

SyntaxHighlighter 語法高亮插件的使用教程