如果我们需要在网页展示代码片段,该不会截图吧?当然不!这个时候我们可以使用一些插件实现这个效果,让用户在网页上看到的代码跟在开发编辑器上的效果一样,高亮显示。
如图
highlight.js高亮代码插件
通过highlight.js这个插件可以轻松实现。可以进入https://highlightjs.org/官网下载源码,然后简单在网页上引用即可。根据官方的例子,我们只需要在页面引入其js和css就行,然后将代码粘贴在
标签内即可战展示。
...
说明:default.css是默认样式,我们可以选择自己喜欢的样式,这个插件提供了非常多的样式,例如黑色背景,白色背景,VScode风格,GitHub风格,IDEA风格等。
class="language-php"代表我们选择的语言,如果你的代码是php的那就是language-php,其他的例如language-html、language-java、language-python、language-js、language-c,根据你设置的代码种类,会自动匹配代码的高亮风格。
示例
<?php
// 声明页面header
header("Content-type:text/html;charset=utf-8");
// 获取access_token
function getToken(){
// 定义id和secret
$corpid='你的企业微信企业ID';
$corpsecret='你的企业微信secret';
// 读取access_token
include './access_token.php';
// 判断是否过期
if (time() > $access_token['expires']){
// 如果已经过期就得重新获取并缓存
$access_token = array();
$access_token['access_token'] = getNewToken($corpid,$corpsecret);
$access_token['expires']=time()+7000;
// 将数组写入php文件
$arr = '';
$arrfile = fopen("./access_token.php","w");
fwrite($arrfile,$arr);
fclose($arrfile);
// 返回当前的access_token
return $access_token['access_token'];
}else{
// 如果没有过期就直接读取缓存文件
return $access_token['access_token'];
}
}
// 获取新的access_token
function getNewToken($corpid,$corpsecret){
$url = "https://qyapi.weixin.qq.com/cgi-bin/gettoken?corpid={$corpid}&corpsecret={$corpsecret}";
$access_token_Arr = https_request($url);
return $access_token_Arr['access_token'];
}
// curl请求函数
function https_request ($url){
$ch = curl_init();
curl_setopt($ch, CURLOPT_URL, $url);
curl_setopt($ch,CURLOPT_RETURNTRANSFER,1);
curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, false);
$out = curl_exec($ch);
curl_close($ch);
return json_decode($out,true);
}
// 发送应用消息函数
function send($data){
$ch = curl_init();
curl_setopt($ch, CURLOPT_URL, 'https://qyapi.weixin.qq.com/cgi-bin/message/send?access_token='.getToken());
curl_setopt($ch, CURLOPT_POST, true);
curl_setopt($ch, CURLOPT_POSTFIELDS, $data);
curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, 0);
curl_setopt($ch, CURLOPT_SSL_VERIFYHOST, 2);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
return curl_exec($ch);
}
// 文本卡片消息体
$postdata = array(
'touser' => '@all',
'msgtype' => 'textcard',
'agentid' => '1000002',
'textcard' => array(
'title' => '测试卡片的标题',
'description' => '测试卡片的描述',
'url' => 'http://www.qq.com',
'btntxt' => '阅读全文',
),
'enable_id_trans' => 0,
'enable_duplicate_check' => 0,
'duplicate_check_interval' => 1800
);
// 调用发送函数
echo send(json_encode($postdata));
?>
在线演示
http://www.likeyunba.com/demo...
Author:TANKING