如何使用Google-Code-Prettify 實現代碼高亮功能

導語:如何使用Google-Code-Prettify 實現代碼高亮功能,爲了方便大家的練習,下面是小編給大家提供的使用方法,大家可以參考閱讀,更多詳情請關注應屆畢業生考試網。

如何使用Google-Code-Prettify 實現代碼高亮功能

   的'使用方法:

  1.引入 jQuery 文件和 文件

<script src=""></script>

<script src=""type="text/javascript"></script>

<link href="/" type="text/css" rel="stylesheet" />

  2.調用 實現代碼高亮

在 body 標籤上添加調用方法,如下:

<body onload="prettyPrint()">

</body>

將你需要高亮顯示的代碼片斷放在 pre標記裏,如下:

<pre class="prettyprint">

@*你的代碼片斷*@

</pre>

  使用jQuery小技巧實現優化

上述方法可以實現代碼的高亮,但每次手動爲pre標籤添加"prettyprint"類,顯示有些麻煩。

使用下邊的代碼片斷來解決這個問題並替換掉 body 的"onload"的事件,實現分離:

$(window)(function(){

$("pre")lass("prettyprint"); prettyPrint();

})

到這我們應該已經成功使用 實現了代碼的高亮顯示,爲了提高頁面加載速度,我們應該將引用的js文件放置在底部