代码高亮插件——wangHightLighter.js——demo演示

wangHighLighter.js demo

语言： 主题：
转换

// $(function () {
if (!window.wangHighLighter) {
return; // 未引用 wangHighLighter.min.js
}

var $sltLang = $('#sltLang'),
langArray = wangHighLighter.getLangArray(),
$sltTheme = $('#sltTheme'),
themeArray = wangHighLighter.getThemeArray(),

$txt1 = $('#txt1'),
$div1 = $('#wangHightLighter_div1'),
$btn1 = $('#btn1');

//绑定语言下拉框
$.each(langArray, function(key, value){
$sltLang.append($('' + value + ''));
});

//绑定主题下拉框
$.each(themeArray, function(key, value){
$sltTheme.append($('' + value + ''));
});

$btn1.click(function () {
var code = $txt1.val(),
lang = $sltLang.val(),
theme = $sltTheme.val(),
highLightCode;

//生成高亮格式化之后的html代码
highLightCode = wangHighLighter.highLight(lang, theme, code);
$div1.html(highLightCode);
});

});
// ]]>
说明：

wangHightLighter.js是一个可以将代码高亮显示的javascript小插件，支持常用的20多语言、多个漂亮的主题。代码开源。

使用说明 & 下载：https://github.com/wangfupeng1988/wangHighLighter



-------------------------------------------------------------------------------------------------------------

欢迎关注我的微博。也欢迎关注我的教程：

《从设计到模式》《深入理解javascript原型和闭包系列》《微软petshop4.0源码解读视频》《json2.js源码解读视频》

-------------------------------------------------------------------------------------------------------------