- 相關(guān)推薦
如何使用Google-Code-Prettify 實(shí)現(xiàn)代碼高亮功能
導(dǎo)語：如何使用Google-Code-Prettify 實(shí)現(xiàn)代碼高亮功能，為了方便大家的練習(xí)，下面是小編給大家提供的使用方法，大家可以參考閱讀，更多詳情請(qǐng)關(guān)注應(yīng)屆畢業(yè)生考試網(wǎng)。
prettify.js 的使用方法：
1.引入 jQuery 文件和 prettify.js 文件
<script src="http://libs.baidu.com/jquery/1.9.0/jquery.min.js"></script>
<script src="prettify.js"type="text/javascript"></script>
<link href="/prettify.css" type="text/css" rel="stylesheet" />
2.調(diào)用 prettify.js 實(shí)現(xiàn)代碼高亮
在 body 標(biāo)簽上添加調(diào)用方法，如下：
<body onload="prettyPrint()">
</body>
將你需要高亮顯示的代碼片斷放在 pre標(biāo)記里，如下：
<pre class="prettyprint">
@*你的代碼片斷*@
</pre>
使用jQuery小技巧實(shí)現(xiàn)優(yōu)化
上述方法可以實(shí)現(xiàn)代碼的高亮，但每次手動(dòng)為pre標(biāo)簽添加"prettyprint"類，顯示有些麻煩。
使用下邊的代碼片斷來解決這個(gè)問題并替換掉 body 的"onload"的事件，實(shí)現(xiàn)分離：
$(window).load(function(){
$("pre").addClass("prettyprint"); prettyPrint();
})
到這我們應(yīng)該已經(jīng)成功使用 prettify.js 實(shí)現(xiàn)了代碼的高亮顯示，為了提高頁面加載速度，我們應(yīng)該將引用的js文件放置在底部
【如何使用Google-Code-Prettify 實(shí)現(xiàn)代碼高亮功能】相關(guān)文章：
使用Dreamweaver代碼提示功能08-05
使用python實(shí)現(xiàn)Linux異步epoll的代碼04-16
如何使用JS實(shí)現(xiàn)短信發(fā)送倒計(jì)時(shí)功能02-17
PHP中如何實(shí)現(xiàn)crontab代碼05-30
PHP簡單留言本功能的實(shí)現(xiàn)代碼08-13
如何使用dreamweaver的模板功能05-30