├── pv.txt
├── favicon.ico
├── fonts
    ├── Monaco.ttf
    ├── Skranji-Regular.ttf
    └── Ubuntu-Regular.ttf
├── live2d
    ├── model
    │   └── xiaoban
    │   │   ├── model.moc
    │   │   ├── model.2048
    │   │       └── texture_00.png
    │   │   └── model.json
    ├── message.json
    ├── js
    │   └── message.js
    └── css
    │   └── live2d.css
├── cool
    ├── banner.js
    ├── clicklove.js
    ├── sitetime.js
    └── cooltext.js
├── js
    ├── app.js
    └── search.js
├── categories
    └── Coding
    │   ├── PSR
    │       └── index.html
    │   └── Design
    │       └── index.html
└── tags
    ├── Cool
        └── index.html
    ├── 设计模式
        └── index.html
    └── Swoole
        └── index.html


/pv.txt:
--------------------------------------------------------------------------------
1 | shuapv


--------------------------------------------------------------------------------
/favicon.ico:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/writeBlog/writeblog.github.io/master/favicon.ico


--------------------------------------------------------------------------------
/fonts/Monaco.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/writeBlog/writeblog.github.io/master/fonts/Monaco.ttf


--------------------------------------------------------------------------------
/fonts/Skranji-Regular.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/writeBlog/writeblog.github.io/master/fonts/Skranji-Regular.ttf


--------------------------------------------------------------------------------
/fonts/Ubuntu-Regular.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/writeBlog/writeblog.github.io/master/fonts/Ubuntu-Regular.ttf


--------------------------------------------------------------------------------
/live2d/model/xiaoban/model.moc:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/writeBlog/writeblog.github.io/master/live2d/model/xiaoban/model.moc


--------------------------------------------------------------------------------
/live2d/model/xiaoban/model.2048/texture_00.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/writeBlog/writeblog.github.io/master/live2d/model/xiaoban/model.2048/texture_00.png


--------------------------------------------------------------------------------
/live2d/message.json:
--------------------------------------------------------------------------------
1 | {"mouseover":[{"selector":".title a","text":["要看看 {text} 么？"]},{"selector":".searchbox","text":["在找什么东西呢，需要帮忙吗？"]}],"click":[{"selector":"#landlord #live2d","text":["不要动手动脚的哦！我家小主可是会打你的~~","你…你在调皮，人家…人家就不帮你止血了！","Hentai！","再摸的话我可要通知我家主人了了！⌇●﹏●⌇","110吗，这里有个调皮鬼一直在摸我(ó﹏ò｡)"]}]}


--------------------------------------------------------------------------------
/live2d/model/xiaoban/model.json:
--------------------------------------------------------------------------------
1 | {"type":"Live2D Model Setting","name":"model","model":"model.moc","textures":["model.2048/texture_00.png"],"motions":{"idle":[{"file":"motions/Idle.mtn"}],"sleepy":[{"file":"motions/Nemui.mtn"}],"flick_head":[{"file":"motions/Anone_Synced.mtn"}],"tap_body":[{"file":"motions/Dance.mtn"}]}}


--------------------------------------------------------------------------------
/cool/banner.js:
--------------------------------------------------------------------------------
 1 | $(function(){
 2 |     $('.banner').mouseenter(function(){
 3 |     const boxHeight = $(this).outerHeight()
 4 |     const boxWidth = $(this).outerWidth()
 5 |     let elementX = $(this).offset().left
 6 |     let elementY =$(this).offset().top
 7 |     //console.log(boxHeight,boxWidth,elementX,elementY)
 8 |     $('.banner').mousemove(function(e){
 9 |        let X = e.pageX - elementX
10 |        let Y = e.pageY - elementY
11 |        let offsetX,offsetY
12 |        offsetX = X - boxWidth/2
13 |        offsetY =  boxHeight/2 - Y
14 |       $(this).css({
15 |          "-webkit-transform": "rotateY(" + offsetX / 20 + "deg) " + "rotateX(" + offsetY / 20 + "deg)"
16 |       })
17 |     })
18 |   })
19 |     $(this).mouseleave(function(){
20 |          $('.banner').css({
21 |          "-webkit-transform": "rotateY(0deg) " + "rotateX(0deg)"
22 |       })
23 |     })
24 |   })


--------------------------------------------------------------------------------
/cool/clicklove.js:
--------------------------------------------------------------------------------
1 | !function(e,t,a){function n(){c(".heart{width: 10px;height: 10px;position: fixed;background: #f00;transform: rotate(45deg);-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);}.heart:after,.heart:before{content: '';width: inherit;height: inherit;background: inherit;border-radius: 50%;-webkit-border-radius: 50%;-moz-border-radius: 50%;position: fixed;}.heart:after{top: -5px;}.heart:before{left: -5px;}"),o(),r()}function r(){for(var e=0;e<d.length;e++)d[e].alpha<=0?(t.body.removeChild(d[e].el),d.splice(e,1)):(d[e].y--,d[e].scale+=.004,d[e].alpha-=.013,d[e].el.style.cssText="left:"+d[e].x+"px;top:"+d[e].y+"px;opacity:"+d[e].alpha+";transform:scale("+d[e].scale+","+d[e].scale+") rotate(45deg);background:"+d[e].color+";z-index:99999");requestAnimationFrame(r)}function o(){var t="function"==typeof e.onclick&&e.onclick;e.onclick=function(e){t&&t(),i(e)}}function i(e){var a=t.createElement("div");a.className="heart",d.push({el:a,x:e.clientX-5,y:e.clientY-5,scale:1,alpha:1,color:s()}),t.body.appendChild(a)}function c(e){var a=t.createElement("style");a.type="text/css";try{a.appendChild(t.createTextNode(e))}catch(t){a.styleSheet.cssText=e}t.getElementsByTagName("head")[0].appendChild(a)}function s(){return"rgb("+~~(255*Math.random())+","+~~(255*Math.random())+","+~~(255*Math.random())+")"}var d=[];e.requestAnimationFrame=function(){return e.requestAnimationFrame||e.webkitRequestAnimationFrame||e.mozRequestAnimationFrame||e.oRequestAnimationFrame||e.msRequestAnimationFrame||function(e){setTimeout(e,1e3/60)}}(),n()}(window,document);


--------------------------------------------------------------------------------
/cool/sitetime.js:
--------------------------------------------------------------------------------
 1 | function siteTime(){
 2 |     window.setTimeout("siteTime()", 1000);
 3 |     var seconds = 1000;
 4 |     var minutes = seconds * 60;
 5 |     var hours = minutes * 60;
 6 |     var days = hours * 24;
 7 |     var years = days * 365;
 8 |     var today = new Date();
 9 |     var todayYear = today.getFullYear();
10 |     var todayMonth = today.getMonth()+1;
11 |     var todayDate = today.getDate();
12 |     var todayHour = today.getHours();
13 |     var todayMinute = today.getMinutes();
14 |     var todaySecond = today.getSeconds();
15 |     /* Date.UTC() -- 返回date对象距世界标准时间(UTC)1970年1月1日午夜之间的毫秒数(时间戳)
16 |     year - 作为date对象的年份，为4位年份值
17 |     month - 0-11之间的整数，做为date对象的月份
18 |     day - 1-31之间的整数，做为date对象的天数
19 |     hours - 0(午夜24点)-23之间的整数，做为date对象的小时数
20 |     minutes - 0-59之间的整数，做为date对象的分钟数
21 |     seconds - 0-59之间的整数，做为date对象的秒数
22 |     microseconds - 0-999之间的整数，做为date对象的毫秒数 */
23 |     var t1 = Date.UTC(2018,11,11,00,00,00); //北京时间2016-12-1 00:00:00
24 |     var t2 = Date.UTC(todayYear,todayMonth,todayDate,todayHour,todayMinute,todaySecond);
25 |     var diff = t2-t1;
26 |     var diffYears = Math.floor(diff/years);
27 |     var diffDays = Math.floor((diff/days)-diffYears*365);
28 |     var diffHours = Math.floor((diff-(diffYears*365+diffDays)*days)/hours);
29 |     var diffMinutes = Math.floor((diff-(diffYears*365+diffDays)*days-diffHours*hours)/minutes);
30 |     var diffSeconds = Math.floor((diff-(diffYears*365+diffDays)*days-diffHours*hours-diffMinutes*minutes)/seconds);
31 |     document.getElementById("sitetime").innerHTML=" <a  href='/' style='color:rgb(61, 197, 80);'>搅拌糖</a> 已在线运行"+diffYears+" 年 "+diffDays+" 天 "+diffHours+" 小时 "+diffMinutes+" 分钟 "+diffSeconds+" 秒"+" ◕‿-｡  ";
32 | }
33 | siteTime();


--------------------------------------------------------------------------------
/cool/cooltext.js:
--------------------------------------------------------------------------------
1 | (function webpackUniversalModuleDefinition(a,b){if(typeof exports==="object"&&typeof module==="object"){module.exports=b()}else{if(typeof define==="function"&&define.amd){define([],b)}else{if(typeof exports==="object"){exports["POWERMODE"]=b()}else{a["POWERMODE"]=b()}}}})(this,function(){return(function(a){var b={};function c(e){if(b[e]){return b[e].exports}var d=b[e]={exports:{},id:e,loaded:false};a[e].call(d.exports,d,d.exports,c);d.loaded=true;return d.exports}c.m=a;c.c=b;c.p="";return c(0)})([function(c,g,b){var d=document.createElement("canvas");d.width=window.innerWidth;d.height=window.innerHeight;d.style.cssText="position:fixed;top:0;left:0;pointer-events:none;z-index:999999";window.addEventListener("resize",function(){d.width=window.innerWidth;d.height=window.innerHeight});document.body.appendChild(d);var a=d.getContext("2d");var n=[];var j=0;var k=120;var f=k;var p=false;o.shake=true;function l(r,q){return Math.random()*(q-r)+r}function m(r){if(o.colorful){var q=l(0,360);return"hsla("+l(q-10,q+10)+", 100%, "+l(50,80)+"%, "+1+")"}else{return window.getComputedStyle(r).color}}function e(){var t=document.activeElement;var v;if(t.tagName==="TEXTAREA"||(t.tagName==="INPUT"&&t.getAttribute("type")==="text")){var u=b(1)(t,t.selectionStart);v=t.getBoundingClientRect();return{x:u.left+v.left,y:u.top+v.top,color:m(t)}}var s=window.getSelection();if(s.rangeCount){var q=s.getRangeAt(0);var r=q.startContainer;if(r.nodeType===document.TEXT_NODE){r=r.parentNode}v=q.getBoundingClientRect();return{x:v.left,y:v.top,color:m(r)}}return{x:0,y:0,color:"transparent"}}function h(q,s,r){return{x:q,y:s,alpha:1,color:r,velocity:{x:-1+Math.random()*2,y:-3.5+Math.random()*2}}}function o(){var t=e();var s=5+Math.round(Math.random()*10);while(s--){n[j]=h(t.x,t.y,t.color);j=(j+1)%500}f=k;if(!p){requestAnimationFrame(i)}if(o.shake){var r=1+2*Math.random();var q=r*(Math.random()>0.5?-1:1);var u=r*(Math.random()>0.5?-1:1);document.body.style.marginLeft=q+"px";document.body.style.marginTop=u+"px";setTimeout(function(){document.body.style.marginLeft="";document.body.style.marginTop=""},75)}}o.colorful=false;function i(){if(f>0){requestAnimationFrame(i);f--;p=true}else{p=false}a.clearRect(0,0,d.width,d.height);for(var q=0;q<n.length;++q){var r=n[q];if(r.alpha<=0.1){continue}r.velocity.y+=0.075;r.x+=r.velocity.x;r.y+=r.velocity.y;r.alpha*=0.96;a.globalAlpha=r.alpha;a.fillStyle=r.color;a.fillRect(Math.round(r.x-1.5),Math.round(r.y-1.5),3,3)}}requestAnimationFrame(i);c.exports=o},function(b,a){(function(){var d=["direction","boxSizing","width","height","overflowX","overflowY","borderTopWidth","borderRightWidth","borderBottomWidth","borderLeftWidth","borderStyle","paddingTop","paddingRight","paddingBottom","paddingLeft","fontStyle","fontVariant","fontWeight","fontStretch","fontSize","fontSizeAdjust","lineHeight","fontFamily","textAlign","textTransform","textIndent","textDecoration","letterSpacing","wordSpacing","tabSize","MozTabSize"];var e=window.mozInnerScreenX!=null;function c(k,l,o){var h=o&&o.debug||false;if(h){var i=document.querySelector("#input-textarea-caret-position-mirror-div");if(i){i.parentNode.removeChild(i)}}var f=document.createElement("div");f.id="input-textarea-caret-position-mirror-div";document.body.appendChild(f);var g=f.style;var j=window.getComputedStyle?getComputedStyle(k):k.currentStyle;g.whiteSpace="pre-wrap";if(k.nodeName!=="INPUT"){g.wordWrap="break-word"}g.position="absolute";if(!h){g.visibility="hidden"}d.forEach(function(p){g[p]=j[p]});if(e){if(k.scrollHeight>parseInt(j.height)){g.overflowY="scroll"}}else{g.overflow="hidden"}f.textContent=k.value.substring(0,l);if(k.nodeName==="INPUT"){f.textContent=f.textContent.replace(/\s/g,"\u00a0")}var n=document.createElement("span");n.textContent=k.value.substring(l)||".";f.appendChild(n);var m={top:n.offsetTop+parseInt(j["borderTopWidth"]),left:n.offsetLeft+parseInt(j["borderLeftWidth"])};if(h){n.style.backgroundColor="#aaa"}else{document.body.removeChild(f)}return m}if(typeof b!="undefined"&&typeof b.exports!="undefined"){b.exports=c}else{window.getCaretCoordinates=c}}())}])});
2 | POWERMODE.colorful=true;POWERMODE.shake=false;document.body.addEventListener("input",POWERMODE);


--------------------------------------------------------------------------------
/live2d/js/message.js:
--------------------------------------------------------------------------------
  1 | function renderTip(template, context) {
  2 |     var tokenReg = /(\\)?\{([^\{\}\\]+)(\\)?\}/g;
  3 |     return template.replace(tokenReg, function (word, slash1, token, slash2) {
  4 |         if (slash1 || slash2) {
  5 |             return word.replace('\\', '');
  6 |         }
  7 |         var variables = token.replace(/\s/g, '').split('.');
  8 |         var currentObject = context;
  9 |         var i, length, variable;
 10 |         for (i = 0, length = variables.length; i < length; ++i) {
 11 |             variable = variables[i];
 12 |             currentObject = currentObject[variable];
 13 |             if (currentObject === undefined || currentObject === null) return '';
 14 |         }
 15 |         return currentObject;
 16 |     });
 17 | }
 18 | 
 19 | String.prototype.renderTip = function (context) {
 20 |     return renderTip(this, context);
 21 | };
 22 | 
 23 | var re = /x/;
 24 | console.log(re);
 25 | re.toString = function() {
 26 |     showMessage('哈哈，你打开了控制台，是想要看看我的秘密吗？', 5000);
 27 |     return '';
 28 | };
 29 | 
 30 | $(document).on('copy', function (){
 31 |     showMessage('你都复制了些什么呀，转载要记得加上出处哦~~', 5000);
 32 | });
 33 | 
 34 | function initTips(){
 35 |     $.ajax({
 36 |         cache: true,
 37 |         url: `${message_Path}message.json`,
 38 |         dataType: "json",
 39 |         success: function (result){
 40 |             $.each(result.mouseover, function (index, tips){
 41 |                 $(tips.selector).mouseover(function (){
 42 |                     var text = tips.text;
 43 |                     if(Array.isArray(tips.text)) text = tips.text[Math.floor(Math.random() * tips.text.length + 1)-1];
 44 |                     text = text.renderTip({text: $(this).text()});
 45 |                     showMessage(text, 3000);
 46 |                 });
 47 |             });
 48 |             $.each(result.click, function (index, tips){
 49 |                 $(tips.selector).click(function (){
 50 |                     var text = tips.text;
 51 |                     if(Array.isArray(tips.text)) text = tips.text[Math.floor(Math.random() * tips.text.length + 1)-1];
 52 |                     text = text.renderTip({text: $(this).text()});
 53 |                     showMessage(text, 3000);
 54 |                 });
 55 |             });
 56 |         }
 57 |     });
 58 | }
 59 | initTips();
 60 | 
 61 | (function (){
 62 |     var text;
 63 |     if(document.referrer !== ''){
 64 |         var referrer = document.createElement('a');
 65 |         referrer.href = document.referrer;
 66 |         text = '嗨！来自 <span style="color:#0099cc;">' + referrer.hostname + '</span> 的朋友！';
 67 |         var domain = referrer.hostname.split('.')[1];
 68 |         if (domain == 'baidu') {
 69 |             text = '嗨！ 来自 百度搜索 的朋友！<br>欢迎访问<span style="color:#0099cc;">「 ' + document.title.split(' - ')[0] + ' 」</span>';
 70 |         }else if (domain == 'so') {
 71 |             text = '嗨！ 来自 360搜索 的朋友！<br>欢迎访问<span style="color:#0099cc;">「 ' + document.title.split(' - ')[0] + ' 」</span>';
 72 |         }else if (domain == 'google') {
 73 |             text = '嗨！ 来自 谷歌搜索 的朋友！<br>欢迎访问<span style="color:#0099cc;">「 ' + document.title.split(' - ')[0] + ' 」</span>';
 74 |         }
 75 |     }else {
 76 |         if (window.location.href == `${home_Path}`) { //主页URL判断，需要斜杠结尾
 77 |             var now = (new Date()).getHours();
 78 |             if (now > 23 || now <= 5) {
 79 |                 text = '你是夜猫子呀？这么晚还不睡觉，明天起的来嘛？';
 80 |             } else if (now > 5 && now <= 7) {
 81 |                 text = '早上好！一日之计在于晨，美好的一天就要开始了！';
 82 |             } else if (now > 7 && now <= 11) {
 83 |                 text = '上午好！工作顺利嘛，不要久坐，多起来走动走动哦！';
 84 |             } else if (now > 11 && now <= 14) {
 85 |                 text = '中午了，工作了一个上午，现在是午餐时间！';
 86 |             } else if (now > 14 && now <= 17) {
 87 |                 text = '午后很容易犯困呢，今天的运动目标完成了吗？';
 88 |             } else if (now > 17 && now <= 19) {
 89 |                 text = '傍晚了！窗外夕阳的景色很美丽呢，最美不过夕阳红~~';
 90 |             } else if (now > 19 && now <= 21) {
 91 |                 text = '晚上好，今天过得怎么样？';
 92 |             } else if (now > 21 && now <= 23) {
 93 |                 text = '已经这么晚了呀，早点休息吧，晚安~~';
 94 |             } else {
 95 |                 text = '嗨~ 快来逗我玩吧！';
 96 |             }
 97 |         }else {
 98 |             text = '欢迎阅读<span style="color:#0099cc;">「 ' + document.title.split(' - ')[0] + ' 」</span>';
 99 |         }
100 |     }
101 |     showMessage(text, 12000);
102 | })();
103 | 
104 | window.setInterval(showHitokoto,30000);
105 | 
106 | function showHitokoto(){
107 |     $.getJSON('https://v1.hitokoto.cn/',function(result){
108 |         showMessage(result.hitokoto, 5000);
109 |     });
110 | }
111 | 
112 | function showMessage(text, timeout){
113 |     if(Array.isArray(text)) text = text[Math.floor(Math.random() * text.length + 1)-1];
114 |     //console.log('showMessage', text);
115 |     $('.message').stop();
116 |     $('.message').html(text).fadeTo(200, 1);
117 |     if (timeout === null) timeout = 5000;
118 |     hideMessage(timeout);
119 | }
120 | 
121 | function hideMessage(timeout){
122 |     $('.message').stop().css('opacity',1);
123 |     if (timeout === null) timeout = 5000;
124 |     $('.message').delay(timeout).fadeTo(200, 0);
125 | }
126 | 
127 | function initLive2d (){
128 |     $('.hide-button').fadeOut(0).on('click', () => {
129 |         $('#landlord').css('display', 'none')
130 |     })
131 |     $('#landlord').hover(() => {
132 |         $('.hide-button').fadeIn(600)
133 |     }, () => {
134 |         $('.hide-button').fadeOut(600)
135 |     })
136 | }
137 | initLive2d ();
138 | 


--------------------------------------------------------------------------------
/live2d/css/live2d.css:
--------------------------------------------------------------------------------
  1 | #landlord {
  2 |     user-select: none;
  3 |     position: fixed;
  4 |     right: 100px;
  5 |     bottom: 0;
  6 |     width: 280px;
  7 |     height: 250px;
  8 |     z-index: 10;
  9 |     font-size: 0;
 10 |     transition: all .3s ease-in-out;
 11 | }
 12 | 
 13 | #live2d {
 14 |     position: relative;
 15 | }
 16 | .live2d{
 17 |     width: 280px;
 18 |     height: 250px;
 19 | }
 20 | 
 21 | .message {
 22 |     opacity: 0;
 23 |     width: 300px;
 24 |     height: auto;
 25 |     margin: auto;
 26 |     padding: 7px;
 27 |     top: -80px;
 28 |     left: -10px;
 29 |     text-align: center;
 30 |     border: 1px solid rgba(255,137,255,.4);
 31 |     border-radius: 12px;
 32 |     background-color: rgba(255, 137, 255, 0.877);
 33 |     box-shadow: 0 3px 15px 2px rgba(255,137,255,.4);
 34 |     font-size: 13px;
 35 |     font-weight: 400;
 36 |     text-overflow: ellipsis;
 37 |     text-transform: uppercase;
 38 |     overflow: hidden;
 39 |     position: absolute;
 40 |     animation-delay: 5s;
 41 |     animation-duration: 50s;
 42 |     animation-iteration-count: infinite;
 43 |     animation-name: shake;
 44 |     animation-timing-function: ease-in-out;
 45 |     z-index: 10000;
 46 | }
 47 | 
 48 | .hide-button {
 49 |     position: absolute;
 50 |     top: 10px;
 51 |     right: 0;
 52 |     /* bottom: 30px; */
 53 |     display: none;
 54 |     overflow: hidden;
 55 |     /* padding: 4px; */
 56 |     width: 60px;
 57 |     height: 20px;
 58 |     border: 1px solid rgba(255,137,255,.4);
 59 |     border-radius: 12px;
 60 |     background: rgba(255,137,255,.2);
 61 |     box-shadow: 0 3px 15px 2px rgba(255,137,255,.4);
 62 |     text-align: center;
 63 |     font-size: 12px;
 64 |     cursor: pointer;
 65 | }
 66 | 
 67 | .hide-button:hover {
 68 |     border: 1px solid #f4a7b9;
 69 |     background: #f4f6f8;
 70 | }
 71 | 
 72 | @media (max-width: 860px) {
 73 |     #landlord {
 74 |         /* display: none; */
 75 |         
 76 |     }
 77 |     #live2d{
 78 |         width: 200;
 79 |         height: 170;
 80 |     }
 81 | }
 82 | 
 83 | @keyframes shake {
 84 |     2% {
 85 |         transform: translate(0.5px, -1.5px) rotate(-0.5deg);
 86 |     }
 87 | 
 88 |     4% {
 89 |         transform: translate(0.5px, 1.5px) rotate(1.5deg);
 90 |     }
 91 | 
 92 |     6% {
 93 |         transform: translate(1.5px, 1.5px) rotate(1.5deg);
 94 |     }
 95 | 
 96 |     8% {
 97 |         transform: translate(2.5px, 1.5px) rotate(0.5deg);
 98 |     }
 99 | 
100 |     10% {
101 |         transform: translate(0.5px, 2.5px) rotate(0.5deg);
102 |     }
103 | 
104 |     12% {
105 |         transform: translate(1.5px, 1.5px) rotate(0.5deg);
106 |     }
107 | 
108 |     14% {
109 |         transform: translate(0.5px, 0.5px) rotate(0.5deg);
110 |     }
111 | 
112 |     16% {
113 |         transform: translate(-1.5px, -0.5px) rotate(1.5deg);
114 |     }
115 | 
116 |     18% {
117 |         transform: translate(0.5px, 0.5px) rotate(1.5deg);
118 |     }
119 | 
120 |     20% {
121 |         transform: translate(2.5px, 2.5px) rotate(1.5deg);
122 |     }
123 | 
124 |     22% {
125 |         transform: translate(0.5px, -1.5px) rotate(1.5deg);
126 |     }
127 | 
128 |     24% {
129 |         transform: translate(-1.5px, 1.5px) rotate(-0.5deg);
130 |     }
131 | 
132 |     26% {
133 |         transform: translate(1.5px, 0.5px) rotate(1.5deg);
134 |     }
135 | 
136 |     28% {
137 |         transform: translate(-0.5px, -0.5px) rotate(-0.5deg);
138 |     }
139 | 
140 |     30% {
141 |         transform: translate(1.5px, -0.5px) rotate(-0.5deg);
142 |     }
143 | 
144 |     32% {
145 |         transform: translate(2.5px, -1.5px) rotate(1.5deg);
146 |     }
147 | 
148 |     34% {
149 |         transform: translate(2.5px, 2.5px) rotate(-0.5deg);
150 |     }
151 | 
152 |     36% {
153 |         transform: translate(0.5px, -1.5px) rotate(0.5deg);
154 |     }
155 | 
156 |     38% {
157 |         transform: translate(2.5px, -0.5px) rotate(-0.5deg);
158 |     }
159 | 
160 |     40% {
161 |         transform: translate(-0.5px, 2.5px) rotate(0.5deg);
162 |     }
163 | 
164 |     42% {
165 |         transform: translate(-1.5px, 2.5px) rotate(0.5deg);
166 |     }
167 | 
168 |     44% {
169 |         transform: translate(-1.5px, 1.5px) rotate(0.5deg);
170 |     }
171 | 
172 |     46% {
173 |         transform: translate(1.5px, -0.5px) rotate(-0.5deg);
174 |     }
175 | 
176 |     48% {
177 |         transform: translate(2.5px, -0.5px) rotate(0.5deg);
178 |     }
179 | 
180 |     50% {
181 |         transform: translate(-1.5px, 1.5px) rotate(0.5deg);
182 |     }
183 | 
184 |     52% {
185 |         transform: translate(-0.5px, 1.5px) rotate(0.5deg);
186 |     }
187 | 
188 |     54% {
189 |         transform: translate(-1.5px, 1.5px) rotate(0.5deg);
190 |     }
191 | 
192 |     56% {
193 |         transform: translate(0.5px, 2.5px) rotate(1.5deg);
194 |     }
195 | 
196 |     58% {
197 |         transform: translate(2.5px, 2.5px) rotate(0.5deg);
198 |     }
199 | 
200 |     60% {
201 |         transform: translate(2.5px, -1.5px) rotate(1.5deg);
202 |     }
203 | 
204 |     62% {
205 |         transform: translate(-1.5px, 0.5px) rotate(1.5deg);
206 |     }
207 | 
208 |     64% {
209 |         transform: translate(-1.5px, 1.5px) rotate(1.5deg);
210 |     }
211 | 
212 |     66% {
213 |         transform: translate(0.5px, 2.5px) rotate(1.5deg);
214 |     }
215 | 
216 |     68% {
217 |         transform: translate(2.5px, -1.5px) rotate(1.5deg);
218 |     }
219 | 
220 |     70% {
221 |         transform: translate(2.5px, 2.5px) rotate(0.5deg);
222 |     }
223 | 
224 |     72% {
225 |         transform: translate(-0.5px, -1.5px) rotate(1.5deg);
226 |     }
227 | 
228 |     74% {
229 |         transform: translate(-1.5px, 2.5px) rotate(1.5deg);
230 |     }
231 | 
232 |     76% {
233 |         transform: translate(-1.5px, 2.5px) rotate(1.5deg);
234 |     }
235 | 
236 |     78% {
237 |         transform: translate(-1.5px, 2.5px) rotate(0.5deg);
238 |     }
239 | 
240 |     80% {
241 |         transform: translate(-1.5px, 0.5px) rotate(-0.5deg);
242 |     }
243 | 
244 |     82% {
245 |         transform: translate(-1.5px, 0.5px) rotate(-0.5deg);
246 |     }
247 | 
248 |     84% {
249 |         transform: translate(-0.5px, 0.5px) rotate(1.5deg);
250 |     }
251 | 
252 |     86% {
253 |         transform: translate(2.5px, 1.5px) rotate(0.5deg);
254 |     }
255 | 
256 |     88% {
257 |         transform: translate(-1.5px, 0.5px) rotate(1.5deg);
258 |     }
259 | 
260 |     90% {
261 |         transform: translate(-1.5px, -0.5px) rotate(-0.5deg);
262 |     }
263 | 
264 |     92% {
265 |         transform: translate(-1.5px, -1.5px) rotate(1.5deg);
266 |     }
267 | 
268 |     94% {
269 |         transform: translate(0.5px, 0.5px) rotate(-0.5deg);
270 |     }
271 | 
272 |     96% {
273 |         transform: translate(2.5px, -0.5px) rotate(-0.5deg);
274 |     }
275 | 
276 |     98% {
277 |         transform: translate(-1.5px, -1.5px) rotate(-0.5deg);
278 |     }
279 | 
280 |     0%, 100% {
281 |         transform: translate(0, 0) rotate(0);
282 |     }
283 | }
284 | 


--------------------------------------------------------------------------------
/js/app.js:
--------------------------------------------------------------------------------
  1 | /* eslint-disable */
  2 | var customSearch;
  3 | (function ($) {
  4 | 
  5 | 	"use strict";
  6 | 	var scrollCorrection = 80; // (header height = 64px) + (gap = 16px)
  7 | 	const $headerAnchor = $('.l_header', '.cover-wrapper');
  8 | 	if ($headerAnchor[0]) {
  9 | 		scrollCorrection = $headerAnchor[0].clientHeight + 16;
 10 | 	}
 11 | 
 12 | 	function scrolltoElement(elem, correction) {
 13 | 		correction = correction || scrollCorrection;
 14 | 		const $elem = elem.href ? $(elem.getAttribute('href')) : $(elem);
 15 | 		$('html, body').animate({ 'scrollTop': $elem.offset().top - correction }, 400);
 16 | 	};
 17 | 
 18 |   function setScrollAnchor(){
 19 | 		// button
 20 | 		const $postsBtn = $('.menu .active');
 21 | 		const $topBtn = $('.s-top');
 22 | 		const $titleBtn = $('h1.title', '#header-meta');
 23 | 		// anchor
 24 | 		const $bodyAnchor = $('.l_body');
 25 | 		// action
 26 | 		if ($postsBtn.length && $bodyAnchor) {
 27 | 			$postsBtn.click(e => { e.preventDefault(); e.stopPropagation(); scrolltoElement($bodyAnchor); });
 28 | 		}
 29 | 		if ($titleBtn.length && $bodyAnchor) {
 30 | 			$titleBtn.click(e => { e.preventDefault(); e.stopPropagation(); scrolltoElement($bodyAnchor); });
 31 | 		}
 32 | 		if ($topBtn.length && $bodyAnchor) {
 33 | 			$topBtn.click(e => { e.preventDefault(); e.stopPropagation(); scrolltoElement($bodyAnchor); });
 34 | 		}
 35 | 
 36 | 		const $coverAnchor = $('.cover-wrapper');
 37 | 		var showHeaderPoint = 0;
 38 | 		if ($coverAnchor[0]) {
 39 | 			showHeaderPoint = $coverAnchor[0].clientHeight - 164;
 40 | 		}
 41 | 		var pos = document.body.scrollTop;
 42 | 		$(document, window).scroll(() => {
 43 | 			const scrollTop = $(window).scrollTop();
 44 | 			const del = scrollTop - pos;
 45 | 			pos = scrollTop;
 46 | 			if (scrollTop > 150) {
 47 | 				$topBtn.addClass('show');
 48 |         if (del > 0) {
 49 |           $topBtn.removeClass('hl');
 50 |         } else {
 51 |           $topBtn.addClass('hl');
 52 |         }
 53 | 			} else {
 54 | 				$topBtn.removeClass('show').removeClass('hl');
 55 | 			}
 56 | 			if (scrollTop > showHeaderPoint) {
 57 | 				$headerAnchor.addClass('show');
 58 | 			} else {
 59 | 				$headerAnchor.removeClass('show');
 60 | 			}
 61 | 		});
 62 |   }
 63 | 
 64 | 	function setHeader() {
 65 | 		if (!window.subData) return;
 66 | 		const $wrapper = $('header .wrapper');
 67 | 		const $comment = $('.s-comment', $wrapper);
 68 | 		const $toc = $('.s-toc', $wrapper);
 69 | 
 70 | 		$wrapper.find('.nav-sub .logo').text(window.subData.title);
 71 | 		let pos = document.body.scrollTop;
 72 | 		$(document, window).scroll(() => {
 73 | 			const scrollTop = $(window).scrollTop();
 74 | 			const del = scrollTop - pos;
 75 | 			if (del >= 50 && scrollTop > 100) {
 76 | 				pos = scrollTop;
 77 | 				$wrapper.addClass('sub');
 78 | 			} else if (del <= -50) {
 79 | 				pos = scrollTop;
 80 | 				$wrapper.removeClass('sub');
 81 | 			}
 82 | 		});
 83 | 
 84 | 		// bind events to every btn
 85 | 		const $commentTarget = $('#comments');
 86 | 		if ($commentTarget.length) {
 87 | 			$comment.click(e => { e.preventDefault(); e.stopPropagation(); scrolltoElement($commentTarget); });
 88 | 		} else $comment.remove();
 89 | 
 90 | 		const $tocTarget = $('.toc-wrapper');
 91 | 		if ($tocTarget.length && $tocTarget.children().length) {
 92 | 			$toc.click((e) => { e.stopPropagation(); $tocTarget.toggleClass('active'); });
 93 | 		} else $toc.remove();
 94 | 
 95 | 
 96 | 
 97 | 	}
 98 | 
 99 | 	function setHeaderMenuSelection() {
100 |     var $headerMenu = $('body .navgation');
101 |     // 先把已经激活的取消激活
102 |     $headerMenu.find('li a.active').removeClass('active');
103 | 		// var $underline = $headerMenu.find('.underline');
104 | 		function setUnderline($item) {
105 | 			// if (!transition) $underline.addClass('disable-trans');
106 | 			if ($item && $item.length) {
107 | 				$item.addClass('active').siblings().removeClass('active');
108 | 			}
109 | 		}
110 | 		//set current active nav
111 | 		var $active_link = null;
112 |     var idname = location.pathname.replace(/\/|%/g, "");
113 |     if (idname.length == 0) {
114 |       idname = "home";
115 |     }
116 | 		var page = idname.match(/page\d{0,}$/g);
117 | 		if (page) {
118 | 			page = page[0];
119 | 			idname = idname.split(page)[0];
120 | 		}
121 |     var index = idname.match(/index.html/);
122 |     if (index) {
123 |       index = index[0];
124 |       idname = idname.split(index)[0];
125 |     }
126 | 		if (idname && $headerMenu) {
127 | 			$active_link = $('#' + idname, $headerMenu);
128 | 			setUnderline($active_link);
129 | 		}
130 | 	}
131 | 
132 | 	function setHeaderMenuPhone() {
133 | 		var $switcher = $('.l_header .switcher .s-menu');
134 | 		$switcher.click(function (e) {
135 | 			e.stopPropagation();
136 | 			$('body').toggleClass('z_menu-open');
137 | 			$switcher.toggleClass('active');
138 | 		});
139 | 		$(document).click(function (e) {
140 | 			$('body').removeClass('z_menu-open');
141 | 			$switcher.removeClass('active');
142 | 		});
143 | 	}
144 | 
145 | 	function setHeaderSearch() {
146 | 		var $switcher = $('.l_header .switcher .s-search');
147 | 		var $header = $('.l_header');
148 | 		var $search = $('.l_header .m_search');
149 | 		if ($switcher.length === 0) return;
150 | 		$switcher.click(function (e) {
151 | 			e.stopPropagation();
152 | 			$header.toggleClass('z_search-open');
153 | 			$search.find('input').focus();
154 | 		});
155 | 		$(document).click(function (e) {
156 | 			$header.removeClass('z_search-open');
157 | 		});
158 | 		$search.click(function (e) {
159 | 			e.stopPropagation();
160 | 		});
161 |     $header.ready(function () {
162 |       $header.bind('keydown', function (event) {
163 |         if (event.keyCode == 9) {
164 |           return false;
165 |         } else {
166 |           var isie = (document.all) ? true: false;
167 |           var key;
168 |           var ev;
169 |           if (isie) { //IE浏览器
170 |             key = window.event.keyCode;
171 |             ev = window.event;
172 |           } else { //火狐浏览器
173 |             key = e.which;
174 |             ev = e;
175 |           }
176 |           if (key == 9) { //IE浏览器
177 |             if (isie) {
178 |               ev.keyCode = 0;
179 |               ev.returnValue = false;
180 |             } else { //火狐浏览器
181 |               ev.which = 0;
182 |               ev.preventDefault();
183 |             }
184 |           }
185 |         }
186 |       });
187 |     });
188 | 	}
189 | 
190 | 	function setTocToggle() {
191 | 		const $toc = $('.toc-wrapper');
192 | 		if ($toc.length === 0) return;
193 | 		// $toc.click((e) => {
194 |         //     e.stopPropagation();
195 |         //     $toc.addClass('active');
196 |         // });
197 | 		$(document).click(() => $toc.removeClass('active'));
198 | 
199 | 		$toc.on('click', 'a', (e) => {
200 | 			e.preventDefault();
201 | 			e.stopPropagation();
202 | 			if (e.target.tagName === 'A') {
203 |         scrolltoElement(e.target);
204 |       } else if (e.target.tagName === 'SPAN') {
205 |         scrolltoElement(e.target.parentElement);
206 |       }
207 |       $toc.removeClass('active');
208 | 		});
209 | 
210 | 		const liElements = Array.from($toc.find('li a'));
211 | 		//function animate above will convert float to int.
212 | 		const getAnchor = () => liElements.map(elem => Math.floor($(elem.getAttribute('href')).offset().top - scrollCorrection));
213 | 
214 | 		let anchor = getAnchor();
215 | 		const scrollListener = () => {
216 | 			const scrollTop = $('html').scrollTop() || $('body').scrollTop();
217 | 			if (!anchor) return;
218 | 			//binary search.
219 | 			let l = 0, r = anchor.length - 1, mid;
220 | 			while (l < r) {
221 | 				mid = (l + r + 1) >> 1;
222 | 				if (anchor[mid] === scrollTop) l = r = mid;
223 | 				else if (anchor[mid] < scrollTop) l = mid;
224 | 				else r = mid - 1;
225 | 			}
226 | 			$(liElements).removeClass('active').eq(l).addClass('active');
227 | 		}
228 | 		$(window)
229 | 			.resize(() => {
230 | 				anchor = getAnchor();
231 | 				scrollListener();
232 | 			})
233 | 			.scroll(() => {
234 | 				scrollListener()
235 | 			});
236 | 		scrollListener();
237 | 	}
238 | 
239 | 
240 | 	$(function () {
241 | 		//set header
242 | 		setHeader();
243 | 		setHeaderMenuSelection();
244 | 		setHeaderMenuPhone();
245 | 		setHeaderSearch();
246 | 
247 | 		setTocToggle();
248 |     setScrollAnchor();
249 | 		// $(".article .video-container").fitVids();
250 | 
251 | 		setTimeout(function () {
252 | 			$('#loading-bar-wrapper').fadeOut(500);
253 | 		}, 300);
254 | 
255 | 
256 | 		if (SEARCH_SERVICE === 'google') {
257 | 			customSearch = new GoogleCustomSearch({
258 | 				apiKey: GOOGLE_CUSTOM_SEARCH_API_KEY,
259 | 				engineId: GOOGLE_CUSTOM_SEARCH_ENGINE_ID,
260 | 				imagePath: "/images/"
261 | 			});
262 | 		}
263 | 		else if (SEARCH_SERVICE === 'algolia') {
264 | 			customSearch = new AlgoliaSearch({
265 | 				apiKey: ALGOLIA_API_KEY,
266 | 				appId: ALGOLIA_APP_ID,
267 | 				indexName: ALGOLIA_INDEX_NAME,
268 | 				imagePath: "/images/"
269 | 			});
270 | 		}
271 | 		else if (SEARCH_SERVICE === 'hexo') {
272 | 			customSearch = new HexoSearch({
273 | 				imagePath: "/images/"
274 | 			});
275 | 		}
276 | 		else if (SEARCH_SERVICE === 'azure') {
277 | 			customSearch = new AzureSearch({
278 | 				serviceName: AZURE_SERVICE_NAME,
279 | 				indexName: AZURE_INDEX_NAME,
280 | 				queryKey: AZURE_QUERY_KEY,
281 | 				imagePath: "/images/"
282 | 			});
283 | 		}
284 | 		else if (SEARCH_SERVICE === 'baidu') {
285 | 			customSearch = new BaiduSearch({
286 | 				apiId: BAIDU_API_ID,
287 | 				imagePath: "/images/"
288 | 			});
289 | 		}
290 | 
291 | 	});
292 | 
293 | })(jQuery);
294 | 


--------------------------------------------------------------------------------
/js/search.js:
--------------------------------------------------------------------------------
  1 | /* eslint-disable */
  2 | var SearchService = "";
  3 | 
  4 | (function($) {
  5 |   /**
  6 |    * A super class of common logics for all search services
  7 |    * @param options : (object)
  8 |    */
  9 |   SearchService = function(options) {
 10 |     var self = this;
 11 | 
 12 |     self.config = $.extend({
 13 |       per_page: 10,
 14 |       selectors: {
 15 |         body: "body",
 16 |         form: ".u-search-form",
 17 |         input: ".u-search-input",
 18 |         container: "#u-search",
 19 |         modal: "#u-search .modal",
 20 |         modal_body: "#u-search .modal-body",
 21 |         modal_footer: "#u-search .modal-footer",
 22 |         modal_overlay: "#u-search .modal-overlay",
 23 |         modal_results: "#u-search .modal-results",
 24 |         modal_metadata: "#u-search .modal-metadata",
 25 |         modal_error: "#u-search .modal-error",
 26 |         modal_loading_bar: "#u-search .modal-loading-bar",
 27 |         modal_ajax_content: "#u-search .modal-ajax-content",
 28 |         modal_logo: '#u-search .modal-footer .logo',
 29 |         btn_close: "#u-search .btn-close",
 30 |         btn_next: "#u-search .btn-next",
 31 |         btn_prev: "#u-search .btn-prev"
 32 |       },
 33 |       brands: {
 34 |         'google': {logo: 'google.svg', url: 'https://cse.google.com'},
 35 |         'algolia': {logo: 'algolia.svg', url: 'https://www.algolia.com'},
 36 |         'hexo': {logo: '', url: ''},
 37 |         'azure': {logo: 'azure.svg', url: 'https://azure.microsoft.com/en-us/services/search/'},
 38 |         'baidu': {logo: 'baidu.svg', url: 'http://zn.baidu.com/cse/home/index'}
 39 |       },
 40 |       imagePath: ROOT + "img/"
 41 |     }, options);
 42 | 
 43 |     self.dom = {};
 44 |     self.percentLoaded = 0;
 45 |     self.open = false;
 46 |     self.queryText = "";
 47 |     self.nav = {
 48 |       next: -1,
 49 |       prev: -1,
 50 |       total: 0,
 51 |       current: 1
 52 |     };
 53 | 
 54 |     self.parseSelectors = function() {
 55 |       for (var key in self.config.selectors) {
 56 |         self.dom[key] = $(self.config.selectors[key]);
 57 |       }
 58 |     };
 59 | 
 60 |     self.beforeQuery = function() {
 61 |       if (!self.open) {
 62 |         self.dom.container.fadeIn();
 63 |         self.dom.body.addClass('modal-active');
 64 |       }
 65 |       self.dom.input.each(function(index,elem) {
 66 |         $(elem).val(self.queryText);
 67 |       });
 68 |       document.activeElement.blur();
 69 |       self.dom.modal_error.hide();
 70 |       self.dom.modal_ajax_content.removeClass('loaded');
 71 |       self.startLoading();
 72 |     };
 73 | 
 74 |     self.afterQuery = function() {
 75 |       self.dom.modal_body.scrollTop(0);
 76 |       self.dom.modal_ajax_content.addClass('loaded');
 77 |       self.stopLoading();
 78 |     };
 79 | 
 80 |     /**
 81 |      * Perform a complete serach operation including UI updates and query
 82 |      * @param startIndex {int} start index or page number
 83 |      */
 84 |     self.search = function(startIndex, callback) {
 85 |       self.beforeQuery();
 86 |       if (self.search instanceof Function) {
 87 |         self.query(self.queryText, startIndex, function() {
 88 |           self.afterQuery();
 89 |         });
 90 |       }
 91 |       else {
 92 |         console.log("query() does not exist.");
 93 |         self.onQueryError(self.queryText, '');
 94 |         self.afterQuery();
 95 |       }
 96 |     };
 97 | 
 98 |     /**
 99 |      * Query error handler
100 |      * @param queryText: (string)
101 |      * @param status: (string)
102 |      */
103 |     self.onQueryError = function(queryText, status) {
104 |       var errMsg = "";
105 |       if (status === "success") errMsg = "No result found for \"" +queryText+ "\".";
106 |       else if (status === "timeout") errMsg = "Unfortunate timeout.";
107 |       else errMsg = "Mysterious failure.";
108 |       self.dom.modal_results.html("");
109 |       self.dom.modal_error.html(errMsg);
110 |       self.dom.modal_error.show();
111 |     };
112 | 
113 |     self.nextPage = function() {
114 |       if (self.nav.next !== -1) {
115 |         self.search(self.nav.next);
116 |       }
117 |     };
118 | 
119 |     self.prevPage = function() {
120 |       if (self.nav.prev !== -1) {
121 |         self.search(self.nav.prev);
122 |       }
123 |     };
124 | 
125 |     /**
126 |      * Generate html for one result
127 |      * @param url : (string) url
128 |      * @param title : (string) title
129 |      * @param digest : (string) digest
130 |      */
131 |     self.buildResult = function(url, title, digest) {
132 |       var html = "";
133 |       html = "<li>";
134 |       html +=   "<a class='result' href='" +url+ "'>";
135 |       html +=     "<span class='title'>" +title+ "</span>";
136 |       html +=     "<span class='digest'>" +digest+ "</span>";
137 |       html +=     "<span class='fas fa-chevron-thin-right'></span>";
138 |       html +=   "</a>";
139 |       html += "</li>";
140 |       return html;
141 |     };
142 | 
143 |     /**
144 |      * Close the modal, resume body scrolling
145 |      * no param
146 |      */
147 |     self.close = function() {
148 |       self.open = false;
149 |       self.dom.container.fadeOut();
150 |       self.dom.body.removeClass('modal-active');
151 |     };
152 | 
153 |     /**
154 |      * Searchform submit event handler
155 |      * @param queryText : (string) the query text
156 |      */
157 |     self.onSubmit = function(event) {
158 |       event.preventDefault();
159 |       self.queryText = $(this).find('.u-search-input').val();
160 |       if (self.queryText) {
161 |         self.search(1);
162 |       }
163 |     };
164 | 
165 |     /**
166 |      * Start loading bar animation
167 |      * no param
168 |      */
169 |     self.startLoading = function() {
170 |       self.dom.modal_loading_bar.show();
171 |       self.loadingTimer = setInterval(function() {
172 |         self.percentLoaded = Math.min(self.percentLoaded+5,95);
173 |         self.dom.modal_loading_bar.css('width', self.percentLoaded+'%');
174 |       }, 100);
175 |     };
176 | 
177 |     /**
178 |      * Stop loading bar animation
179 |      * no param
180 |      */
181 |     self.stopLoading = function() {
182 |       clearInterval(self.loadingTimer);
183 |       self.dom.modal_loading_bar.css('width', '100%');
184 |       self.dom.modal_loading_bar.fadeOut();
185 |       setTimeout(function() {
186 |         self.percentLoaded = 0;
187 |         self.dom.modal_loading_bar.css('width', '0%');
188 |       }, 300);
189 |     };
190 | 
191 |     /**
192 |      * Add service branding
193 |      * @param service {String} service name
194 |      */
195 |     self.addLogo = function(service) {
196 |       var html = "";
197 |       if (self.config.brands[service] && self.config.brands[service].logo) {
198 |         html += "<a href='" +self.config.brands[service].url+ "' class='" +service+ "'>";
199 |         html +=    '<img src="' +self.config.imagePath+self.config.brands[service].logo+ '" />';
200 |         html += "</a>";
201 |         self.dom.modal_logo.html(html);
202 |       }
203 |     };
204 | 
205 |     self.destroy = function() {
206 |       self.dom.form.each(function(index,elem) {
207 |         $(elem).off('submit');
208 |       });
209 |       self.dom.modal_overlay.off('click');
210 |       self.dom.btn_close.off('click');
211 |       self.dom.btn_next.off('click');
212 |       self.dom.btn_prev.off('click');
213 |       self.dom.container.remove();
214 |     };
215 | 
216 |     /**
217 |      * Load template and register event handlers
218 |      * no param
219 |      */
220 |     self.init = function() {
221 |       $('body').append(template);
222 |       self.parseSelectors();
223 |       self.dom.modal_footer.show();
224 |       self.dom.form.each(function(index,elem) {
225 |         $(elem).on('submit', self.onSubmit);
226 |       });
227 |       self.dom.modal_overlay.on('click', self.close);
228 |       self.dom.btn_close.on('click', self.close);
229 |       self.dom.btn_next.on('click', self.nextPage);
230 |       self.dom.btn_prev.on('click', self.prevPage);
231 |     };
232 | 
233 |     self.init();
234 |   };
235 | 
236 |   var template = '<div id="u-search"><div class="modal"> <header class="modal-header" class="clearfix"><form id="u-search-modal-form" class="u-search-form" name="uSearchModalForm"> <input type="text" id="u-search-modal-input" class="u-search-input" /> <button type="submit" id="u-search-modal-btn-submit" class="u-search-btn-submit"> <span class="fas fa-search"></span> </button></form> <a class="btn-close"> <span class="fas fa-times"></span> </a><div class="modal-loading"><div class="modal-loading-bar"></div></div> </header> <main class="modal-body"><ul class="modal-results modal-ajax-content"></ul> </main> <footer class="modal-footer clearfix"><div class="modal-metadata modal-ajax-content"> <strong class="range"></strong> of <strong class="total"></strong></div><div class="modal-error"></div> <div class="logo"></div> <a class="nav btn-next modal-ajax-content"> <span class="text">NEXT</span> <span class="fas fa-chevron-right"></span> </a> <a class="nav btn-prev modal-ajax-content"> <span class="fas fa-chevron-left"></span> <span class="text">PREV</span> </a> </footer></div><div class="modal-overlay"></div></div>';
237 | })(jQuery);
238 | 
239 | var AlgoliaSearch;
240 | 
241 | (function($) {
242 |   'use strict';
243 | 
244 |   /**
245 |    * Search by Algolia Search
246 |    * @param options : (object)
247 |    */
248 |   AlgoliaSearch = function(options) {
249 |     SearchService.apply(this, arguments);
250 |     var self = this;
251 |     var endpoint = "https://" +self.config.app_id+ "-dsn.algolia.net/1/indexes/" +self.config.indexName;
252 |     self.addLogo('algolia');
253 | 
254 |     /**
255 |      * Generate result list html
256 |      * @param data : (array) result items
257 |      */
258 |     self.buildResultList = function(data) {
259 |       var html = "";
260 |       $.each(data, function(index, row) {
261 |         var url = row.permalink || row.path || "";
262 |         if (!row.permalink && row.path) {
263 |           url = ROOT + url;
264 |         }
265 |         var title = row.title;
266 |         var digest = row._highlightResult.excerptStrip.value || "";
267 |         html += self.buildResult(url, title, digest);
268 |       });
269 |       return html;
270 |     };
271 | 
272 |     /**
273 |      * Generate metadata after a successful query
274 |      * @param data : (object) the raw search response data
275 |      */
276 |     self.buildMetadata = function(data) {
277 |       self.nav.current = data.page * data.hitsPerPage + 1;
278 |       self.nav.currentCount = data.hits.length;
279 |       self.nav.total = parseInt(data.nbHits);
280 |       self.dom.modal_metadata.children('.total').html(self.nav.total);
281 |       self.dom.modal_metadata.children('.range').html(self.nav.current + "-" + (self.nav.current+self.nav.currentCount-1));
282 |       if (self.nav.total > 0) {
283 |         self.dom.modal_metadata.show();
284 |       }
285 |       else {
286 |         self.dom.modal_metadata.hide();
287 |       }
288 | 
289 |       if (data.page < data.nbPages-1) {
290 |         self.nav.next = (data.page+1)+1;
291 |         self.dom.btn_next.show();
292 |       }
293 |       else {
294 |         self.nav.next = -1;
295 |         self.dom.btn_next.hide();
296 |       }
297 |       if (data.page > 0) {
298 |         self.nav.prev = (data.page+1)-1;
299 |         self.dom.btn_prev.show();
300 |       }
301 |       else {
302 |         self.nav.prev = -1;
303 |         self.dom.btn_prev.hide();
304 |       }
305 |     };
306 | 
307 |     /**
308 |      * Send a GET request
309 |      * @param queryText : (string) the query text
310 |      * @param page : (int) the current page (start from 1)
311 |      * @param callback : (function)
312 |      */
313 |     self.query = function(queryText, page, callback) {
314 |       $.get(endpoint, {
315 |         query: queryText,
316 |         page: page-1,
317 |         hitsPerPage: self.config.per_page,
318 |         "x-algolia-application-id": self.config.app_id,
319 |         "x-algolia-api-key": self.config.apiKey
320 |       }, function(data, status) {
321 |         if (status === 'success' && data.hits && data.hits.length > 0) {
322 |           var results = self.buildResultList(data.hits);
323 |           self.dom.modal_results.html(results);
324 |         }
325 |         else {
326 |           self.onQueryError(queryText, status);
327 |         }
328 |         self.buildMetadata(data);
329 |         if (callback) {
330 |           callback(data);
331 |         }
332 |       });
333 |     };
334 | 
335 |     return self;
336 |   };
337 | 
338 | })(jQuery);
339 | var AzureSearch;
340 | 
341 | (function($) {
342 |   'use strict';
343 | 
344 |   /**
345 |    * Search by Azure Search API
346 |    * @param options : (object)
347 |    */
348 |   AzureSearch = function(options) {
349 |     SearchService.apply(this, arguments);
350 |     var self = this;
351 |     var endpoint = "https://" +self.config.serviceName+ ".search.windows.net/indexes/" +self.config.indexName+ "/docs?api-version=2015-02-28";
352 |     self.nav.current = 1;
353 |     self.addLogo('azure');
354 | 
355 |     /**
356 |      * Generate result list html
357 |      * @param data : (array) result items
358 |      */
359 |     self.buildResultList = function(data) {
360 |       var html = "";
361 |       $.each(data, function(index, row) {
362 |         var url = row.permalink || row.path || "";
363 |         if (!row.permalink && row.path) {
364 |           url = "/" + url;
365 |         }
366 |         var title = row.title;
367 |         var digest = row.excerpt || "";
368 |         html += self.buildResult(url, title, digest);
369 |       });
370 |       return html;
371 |     };
372 | 
373 |     /**
374 |      * Generate metadata after a successful query
375 |      * @param data : (object) the raw response data
376 |      * @param startIndex : (int) requested start index of current query
377 |      */
378 |     self.buildMetadata = function(data, startIndex) {
379 |       self.nav.current = startIndex;
380 |       self.nav.currentCount = data.value.length;
381 |       self.nav.total = parseInt(data['@odata.count']);
382 |       self.dom.modal_metadata.children('.total').html(self.nav.total);
383 |       self.dom.modal_metadata.children('.range').html(self.nav.current + "-" + (self.nav.current+self.nav.currentCount-1));
384 |       if (self.nav.total > 0) {
385 |         self.dom.modal_metadata.show();
386 |       }
387 |       else {
388 |         self.dom.modal_metadata.hide();
389 |       }
390 | 
391 |       if (self.nav.current+self.nav.currentCount <= self.nav.total) {
392 |         self.nav.next = self.nav.current+self.nav.currentCount;
393 |         self.dom.btn_next.show();
394 |       }
395 |       else {
396 |         self.nav.next = -1;
397 |         self.dom.btn_next.hide();
398 |       }
399 |       if (self.nav.current > 1) {
400 |         self.nav.prev = self.nav.current-self.config.per_page;
401 |         self.dom.btn_prev.show();
402 |       }
403 |       else {
404 |         self.nav.prev = -1;
405 |         self.dom.btn_prev.hide();
406 |       }
407 |     };
408 | 
409 |     /**
410 |      * Send a GET request
411 |      * @param queryText : (string) the query text
412 |      * @param page : (int) the current page (start from 1)
413 |      * @param callback : (function)
414 |      */
415 |     self.query = function(queryText, startIndex, callback) {
416 |       $.ajax({
417 |         url: endpoint,
418 |         headers: {
419 |           "Accept": "application/json",
420 |           "api-key": self.config.queryKey
421 |         },
422 |         data: {
423 |           search: queryText,
424 |           $orderby: "date desc",
425 |           $skip: startIndex-1,
426 |           $top: self.config.per_page,
427 |           $count: true
428 |         },
429 |         type: "GET",
430 |         success: function(data, status) {
431 |           if (status === 'success' && data.value && data.value.length > 0) {
432 |             var results = self.buildResultList(data.value);
433 |             self.dom.modal_results.html(results);
434 |           }
435 |           else {
436 |             self.onQueryError(queryText, status);
437 |           }
438 |           self.buildMetadata(data, startIndex);
439 |           if (callback) {
440 |             callback(data);
441 |           }
442 |         }
443 |       });
444 |     };
445 | 
446 |     return self;
447 |   };
448 | 
449 | })(jQuery);
450 | var BaiduSearch;
451 | 
452 | (function($) {
453 |   'use strict';
454 | 
455 |   /**
456 |    * TODO
457 |    * Search by Baidu Search API
458 |    * @param options : (object)
459 |    */
460 |   BaiduSearch = function(options) {
461 |     SearchService.apply(this, arguments);
462 |     var self = this;
463 |     var endpoint = "";
464 |     self.addLogo('baidu');
465 | 
466 |     /**
467 |      * Generate result list html
468 |      * @param data : (array) result items
469 |      */
470 |     self.buildResultList = function(data, queryText) {
471 |       var results = [],
472 |           html = "";
473 |       $.each(data, function(index, post) {
474 |         if (self.contentSearch(post, queryText))
475 |           html += self.buildResult(post.linkUrl, post.title, post.abstract);
476 |       });
477 |       return html;
478 |     };
479 | 
480 |     /**
481 |      * Generate metadata after a successful query
482 |      * @param data : (object) the raw google custom search response data
483 |      */
484 |     self.buildMetadata = function(data) {
485 | 
486 |     };
487 | 
488 |     self.loadScript = function() {
489 |       self.dom.input.each(function(index,elem) {
490 |         $(elem).attr('disabled', true);
491 |       });
492 |       var script = "<script src='http://zhannei.baidu.com/api/customsearch/apiaccept?sid=" +self.config.apiId+ "&v=2.0&callback=customSearch.initBaidu' type='text/javascript' charset='utf-8'></script>";
493 |       self.dom.body.append(script);
494 |     };
495 | 
496 |     self.initBaidu = function() {
497 |       self.cse = new BCse.Search(self.config.apiId);
498 |       //self.cse.setPageNum(self.config.per_page);
499 |       self.dom.input.each(function(index,elem) {
500 |         $(elem).attr('disabled', false);
501 |       });
502 |     };
503 | 
504 |     /**
505 |      * Get search results
506 |      * @param queryText {String}
507 |      * @param page {Integer}
508 |      * @param callback {Function}
509 |      */
510 |     self.query = function(queryText, page, callback) {
511 |       self.cse.getResult(queryText, function(data) {
512 |         console.log("Searching: " + queryText);
513 |         self.cse.getError(function(data) {
514 |           console.log(data);
515 |         });
516 |         if (data.length > 0) {
517 |           self.buildResultList(data, queryText);
518 |           self.cse.getSearchInfo(queryText, function(data) {
519 |             console.log(data);
520 |             self.buildMetadata(data);
521 |           });
522 |         }
523 |         else {
524 |           self.nav.total = 0;
525 |           self.nav.next = -1;
526 |           self.nav.prev = -1;
527 |           self.dom.modal_metadata.hide();
528 |           self.dom.btn_next.hide();
529 |           self.dom.btn_prev.hide();
530 |           self.onQueryError(queryText, "success");
531 |         }
532 |         if (callback instanceof Function) {
533 |           callback();
534 |         }
535 |       });
536 |     };
537 | 
538 |     self.loadScript();
539 | 
540 |     return self;
541 |   };
542 | 
543 | })(jQuery);
544 | var GoogleCustomSearch = "";
545 | 
546 | (function($) {
547 |   'use strict';
548 | 
549 |   /**
550 |    * Search by Google Custom Search Engine JSON API
551 |    * @param options : (object)
552 |    */
553 |   GoogleCustomSearch = function(options) {
554 |     SearchService.apply(this, arguments);
555 |     var self = this;
556 |     var endpoint = "https://www.googleapis.com/customsearch/v1";
557 |     self.addLogo('google');
558 | 
559 |     /**
560 |      * Generate result list html
561 |      * @param data : (array) result items
562 |      */
563 |     self.buildResultList = function(data) {
564 |       var html = "";
565 |       $.each(data, function(index, row) {
566 |         var url = row.link;
567 |         var title = row.title;
568 |         var digest = (row.htmlSnippet || "").replace('<br>','');
569 |         html += self.buildResult(url, title, digest);
570 |       });
571 |       return html;
572 |     };
573 | 
574 |     /**
575 |      * Generate metadata after a successful query
576 |      * @param data : (object) the raw google custom search response data
577 |      */
578 |     self.buildMetadata = function(data) {
579 |       if (data.queries && data.queries.request && data.queries.request[0].totalResults !== '0') {
580 |         self.nav.current = data.queries.request[0].startIndex;
581 |         self.nav.currentCount = data.queries.request[0].count;
582 |         self.nav.total = parseInt(data.queries.request[0].totalResults);
583 |         self.dom.modal_metadata.children('.total').html(self.nav.total);
584 |         self.dom.modal_metadata.children('.range').html(self.nav.current + "-" + (self.nav.current+self.nav.currentCount-1));
585 |         self.dom.modal_metadata.show();
586 |       }
587 |       else {
588 |         self.dom.modal_metadata.hide();
589 |       }
590 |       if (data.queries && data.queries.nextPage) {
591 |         self.nav.next = data.queries.nextPage[0].startIndex;
592 |         self.dom.btn_next.show();
593 |       }
594 |       else {
595 |         self.nav.next = -1;
596 |         self.dom.btn_next.hide();
597 |       }
598 |       if (data.queries && data.queries.previousPage) {
599 |         self.nav.prev = data.queries.previousPage[0].startIndex;
600 |         self.dom.btn_prev.show();
601 |       }
602 |       else {
603 |         self.nav.prev = -1;
604 |         self.dom.btn_prev.hide();
605 |       }
606 |     };
607 | 
608 |     /**
609 |      * Send a GET request
610 |      * @param queryText : (string) the query text
611 |      * @param startIndex : (int) the index of first item (start from 1)
612 |      * @param callback : (function)
613 |      */
614 |     self.query = function(queryText, startIndex, callback) {
615 |       $.get(endpoint, {
616 |         key: self.config.apiKey,
617 |         cx: self.config.engineId,
618 |         q: queryText,
619 |         start: startIndex,
620 |         num: self.config.per_page
621 |       }, function(data, status) {
622 |         if (status === 'success' && data.items && data.items.length > 0) {
623 |           var results = self.buildResultList(data.items);
624 |           self.dom.modal_results.html(results);
625 |         }
626 |         else {
627 |           self.onQueryError(queryText, status);
628 |         }
629 |         self.buildMetadata(data);
630 |         if (callback) {
631 |           callback();
632 |         }
633 |       });
634 |     };
635 | 
636 |     return self;
637 |   };
638 | })(jQuery);
639 | var HexoSearch;
640 | 
641 | (function($) {
642 |   'use strict';
643 | 
644 |   /**
645 |   * Search by Hexo generator json content
646 |   * @param options : (object)
647 |   */
648 |   HexoSearch = function(options) {
649 |     SearchService.apply(this, arguments);
650 |     var self = this;
651 |     self.config.endpoint = ROOT + ((options||{}).endpoint || "content.json");
652 |     self.config.endpoint = self.config.endpoint.replace("//","/"); //make sure the url is correct
653 |     self.cache = "";
654 | 
655 |     /**
656 |      * Search queryText in title and content of a post
657 |      * Credit to: http://hahack.com/codes/local-search-engine-for-hexo/
658 |      * @param post : the post object
659 |      * @param queryText : the search query
660 |      */
661 |     self.contentSearch = function(post, queryText) {
662 |       var post_title = post.title.trim().toLowerCase(),
663 |           post_content = post.text.trim().toLowerCase(),
664 |           keywords = queryText.trim().toLowerCase().split(" "),
665 |           foundMatch = false,
666 |           index_title = -1,
667 |           index_content = -1,
668 |           first_occur = -1;
669 |       if (post_title !== '' && post_content !== '') {
670 |         $.each(keywords, function(index, word) {
671 |           index_title = post_title.indexOf(word);
672 |           index_content = post_content.indexOf(word);
673 |           if (index_title < 0 && index_content < 0) {
674 |             foundMatch = false;
675 |           }
676 |           else {
677 |             foundMatch = true;
678 |             if (index_content < 0) {
679 |               index_content = 0;
680 |             }
681 |             if (index === 0) {
682 |               first_occur = index_content;
683 |             }
684 |           }
685 |           if (foundMatch) {
686 |             post_content = post.text.trim();
687 |             var start = 0, end = 0;
688 |             if (first_occur >= 0) {
689 |               start = Math.max(first_occur-30, 0);
690 |               end = (start === 0) ? Math.min(200, post_content.length) : Math.min(first_occur+170, post_content.length);
691 |               var match_content = post_content.substring(start, end);
692 |               keywords.forEach(function(keyword) {
693 |                 var regS = new RegExp(keyword, "gi");
694 |                 match_content = match_content.replace(regS, "<b>"+keyword+"</b>");
695 |               });
696 |               post.digest = match_content;
697 |             }
698 |             else {
699 |               end = Math.min(200, post_content.length);
700 |               post.digest = post_content.trim().substring(0, end);
701 |             }
702 |           }
703 |         });
704 |       }
705 |       return foundMatch;
706 |     };
707 | 
708 |     /**
709 |      * Generate result list html
710 |      * @param data : (array) result items
711 |      */
712 |     self.buildResultList = function(data, queryText) {
713 |       var results = [],
714 |           html = "";
715 |       $.each(data, function(index, post) {
716 |         if (self.contentSearch(post, queryText))
717 |           html += self.buildResult(post.permalink, post.title, post.digest);
718 |       });
719 |       return html;
720 |     };
721 | 
722 |     /**
723 |      * Generate metadata after a successful query
724 |      * @param data : (object) the raw google custom search response data
725 |      */
726 |     self.buildMetadata = function(data) {
727 |       self.dom.modal_footer.hide();
728 |     };
729 | 
730 |     /**
731 |      * Send a GET request
732 |      * @param queryText : (string) the query text
733 |      * @param startIndex : (int) the index of first item (start from 1)
734 |      * @param callback : (function)
735 |      */
736 |     self.query = function(queryText, startIndex, callback) {
737 |       if (!self.cache) {
738 |         $.get(self.config.endpoint, {
739 |           key: self.config.apiKey,
740 |           cx: self.config.engineId,
741 |           q: queryText,
742 |           start: startIndex,
743 |           num: self.config.per_page
744 |         }, function(data, status) {
745 |           if (status !== 'success' ||
746 |               !data ||
747 |               (!data.posts && !data.pages) ||
748 |               (data.posts.length < 1 && data.pages.length < 1)
749 |             ) {
750 |             self.onQueryError(queryText, status);
751 |           }
752 |           else {
753 |             self.cache = data;
754 |             var results = "";
755 |             results += self.buildResultList(data.pages, queryText);
756 |             results += self.buildResultList(data.posts, queryText);
757 |             self.dom.modal_results.html(results);
758 |           }
759 |           self.buildMetadata(data);
760 |           if (callback) {
761 |             callback(data);
762 |           }
763 |         });
764 |       }
765 |       else {
766 |         var results = "";
767 |         results += self.buildResultList(self.cache.pages, queryText);
768 |         results += self.buildResultList(self.cache.posts, queryText);
769 |         self.dom.modal_results.html(results);
770 |         self.buildMetadata(self.cache);
771 |         if (callback) {
772 |           callback(self.cache);
773 |         }
774 |       }
775 |     };
776 | 
777 |     return self;
778 |   };
779 | 
780 | })(jQuery);
781 | 


--------------------------------------------------------------------------------
/categories/Coding/PSR/index.html:
--------------------------------------------------------------------------------
   1 | <!DOCTYPE html>
   2 | <html>
   3 | <head>
   4 |   <meta charset="utf-8">
   5 |   <meta http-equiv="X-UA-Compatible" content="IE=edge" />
   6 |   
   7 |   <title>Category: PSR | 搅拌糖</title>
   8 |   
   9 |   <meta name="keywords" content="搅拌糖,搅拌糖°,搅拌糖的个人博客">
  10 |   
  11 |   
  12 |   <meta name="description" content="种一棵树最好的时间是十年前，其次是现在">
  13 |   
  14 | 
  15 |   
  16 |   <link rel="shortcut icon" type="image/ico" href="/favicon.ico"/>
  17 |   <meta name="HandheldFriendly" content="True" />
  18 |   <meta name="apple-mobile-web-app-capable" content="yes">
  19 |   <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  20 |   <!-- meta -->
  21 |   
  22 | 
  23 |   <!-- link -->
  24 |   <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/fancyapps/fancybox@3.5.7/dist/jquery.fancybox.min.css" />
  25 |   
  26 |   <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/node-waves@0.7.6/dist/waves.min.css">
  27 |   
  28 |   <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@5.10.1/css/all.min.css">
  29 |   
  30 | 
  31 |   
  32 | 
  33 |   
  34 |     <link rel="stylesheet" href="/style.css">
  35 |   
  36 | 
  37 |   <script>
  38 |     function setLoadingBarProgress(num) {
  39 |       document.getElementById('loading-bar').style.width=num+"%";
  40 |     }
  41 |   </script>
  42 | 
  43 |   
  44 |   
  45 |   <!-- 血小板-->
  46 | <link rel="stylesheet" href="/live2d/css/live2d.css" />
  47 | </head>
  48 | 
  49 | <body>
  50 |   
  51 |   
  52 |   <div class="cover-wrapper">
  53 |     <cover class='cover  half'>
  54 |       
  55 |         
  56 |   <img class='logo shake' src='http://cdn.treelo.xin/avatar.png'/>
  57 | 
  58 | 
  59 |   <div class="m_search">
  60 |     <form name="searchform" class="form u-search-form">
  61 |       <input type="text" class="input u-search-input" placeholder="" />
  62 |       <i class="icon fas fa-search fa-fw"></i>
  63 |     </form>
  64 |   </div>
  65 | 
  66 | <div class='menu navgation'>
  67 |   <ul class='h-list'>
  68 |     
  69 |       
  70 |         <li>
  71 |           <a class="nav home" href="/"
  72 |             
  73 |             
  74 |             id="home">
  75 |             <i class='fas fa-rss fa-fw'></i>&nbsp;博文
  76 |           </a>
  77 |         </li>
  78 |       
  79 |         <li>
  80 |           <a class="nav home" href="/projects/"
  81 |             
  82 |             
  83 |             id="projects">
  84 |             <i class='fas fa-code-branch fa-fw'></i>&nbsp;项目
  85 |           </a>
  86 |         </li>
  87 |       
  88 |         <li>
  89 |           <a class="nav home" href="/friends/"
  90 |             
  91 |               rel="nofollow"
  92 |             
  93 |             
  94 |             id="friends">
  95 |             <i class='fas fa-link fa-fw'></i>&nbsp;友链
  96 |           </a>
  97 |         </li>
  98 |       
  99 |         <li>
 100 |           <a class="nav home" href="/about/"
 101 |             
 102 |               rel="nofollow"
 103 |             
 104 |             
 105 |             id="about">
 106 |             <i class='fas fa-info-circle fa-fw'></i>&nbsp;关于
 107 |           </a>
 108 |         </li>
 109 |       
 110 |     
 111 |   </ul>
 112 | </div>
 113 | 
 114 |       
 115 |     </cover>
 116 |     <header class="l_header pure">
 117 |   <div id="loading-bar-wrapper">
 118 |     <div id="loading-bar" class="pure"></div>
 119 |   </div>
 120 | 
 121 | 	<div class='wrapper'>
 122 | 		<div class="nav-main container container--flex">
 123 |       <a class="logo flat-box" href='/' >
 124 |         
 125 |           搅拌糖
 126 |         
 127 |       </a>
 128 | 			<div class='menu navgation'>
 129 | 				<ul class='h-list'>
 130 |           
 131 |   					
 132 |   						<li>
 133 | 								<a class="nav flat-box" href="/"
 134 |                   
 135 |                   
 136 |                   id="home">
 137 | 									<i class='fas fa-shapes fa-fw'></i>&nbsp;博客
 138 | 								</a>
 139 | 							</li>
 140 |       			
 141 |   						<li>
 142 | 								<a class="nav flat-box" href="/categories/"
 143 |                   
 144 |                     rel="nofollow"
 145 |                   
 146 |                   
 147 |                   id="categories">
 148 | 									<i class='fas fa-calendar-alt fa-fw'></i>&nbsp;归档
 149 | 								</a>
 150 | 							</li>
 151 |       			
 152 |   						<li>
 153 | 								<a class="nav flat-box" href="/2018/11/11/message/"
 154 |                   
 155 |                     rel="nofollow"
 156 |                   
 157 |                   
 158 |                   id="20181111message">
 159 | 									<i class='fas fa-comment-alt fa-fw'></i>&nbsp;留言
 160 | 								</a>
 161 | 							</li>
 162 |       			
 163 |       		
 164 | 				</ul>
 165 | 			</div>
 166 | 
 167 | 			
 168 | 				<div class="m_search">
 169 | 					<form name="searchform" class="form u-search-form">
 170 | 						<input type="text" class="input u-search-input" placeholder="搜索" />
 171 | 						<i class="icon fas fa-search fa-fw"></i>
 172 | 					</form>
 173 | 				</div>
 174 | 			
 175 | 			<ul class='switcher h-list'>
 176 | 				
 177 | 					<li class='s-search'><a class="fas fa-search fa-fw" href='javascript:void(0)' target="_blank" rel="noopener"></a></li>
 178 | 				
 179 | 				<li class='s-menu'><a class="fas fa-bars fa-fw" href='javascript:void(0)' target="_blank" rel="noopener"></a></li>
 180 | 			</ul>
 181 | 		</div>
 182 | 
 183 | 		<div class='nav-sub container container--flex'>
 184 | 			<a class="logo flat-box"></a>
 185 | 			<ul class='switcher h-list'>
 186 | 				<li class='s-comment'><a class="flat-btn fas fa-comments fa-fw" href='javascript:void(0)' target="_blank" rel="noopener"></a></li>
 187 |         
 188 |           <li class='s-toc'><a class="flat-btn fas fa-list fa-fw" href='javascript:void(0)' target="_blank" rel="noopener"></a></li>
 189 |         
 190 | 			</ul>
 191 | 		</div>
 192 | 	</div>
 193 | </header>
 194 | 	<aside class="menu-phone">
 195 |     <header>
 196 | 		<nav class="menu navgation">
 197 |       <ul>
 198 |         
 199 |           
 200 |             <li>
 201 | 							<a class="nav flat-box" href="/"
 202 |                 
 203 |                 
 204 |                 id="home">
 205 | 								<i class='fas fa-shapes fa-fw'></i>&nbsp;博客
 206 | 							</a>
 207 |             </li>
 208 |           
 209 |             <li>
 210 | 							<a class="nav flat-box" href="/categories/"
 211 |                 
 212 |                   rel="nofollow"
 213 |                 
 214 |                 
 215 |                 id="categories">
 216 | 								<i class='fas fa-calendar-alt fa-fw'></i>&nbsp;归档
 217 | 							</a>
 218 |             </li>
 219 |           
 220 |             <li>
 221 | 							<a class="nav flat-box" href="/2018/11/11/message/"
 222 |                 
 223 |                   rel="nofollow"
 224 |                 
 225 |                 
 226 |                 id="20181111message">
 227 | 								<i class='fas fa-comment-alt fa-fw'></i>&nbsp;留言
 228 | 							</a>
 229 |             </li>
 230 |           
 231 |        
 232 |       </ul>
 233 | 		</nav>
 234 |     </header>
 235 | 	</aside>
 236 | <script>setLoadingBarProgress(40);</script>
 237 | 
 238 |   </div>
 239 | 
 240 | 
 241 |   <div class="l_body">
 242 |     <div class='body-wrapper'>
 243 |       
 244 | <div class='l_main'>
 245 |   
 246 |     
 247 |       
 248 |   <section class="post-list">
 249 |     
 250 |       
 251 |         
 252 |           
 253 |         
 254 |       
 255 |     
 256 |     
 257 |       
 258 |         
 259 |           <div class='post-wrapper'>
 260 |             <article class="post reveal banner ">
 261 |   
 262 | 
 263 | 
 264 |   <section class='meta'>
 265 |     
 266 |     
 267 |     <div class="meta" id="header-meta">
 268 |       
 269 |         
 270 |   <h2 class="title">
 271 |     <a href="/2019/04/02/php-coding/">
 272 |       PHPer-我所认可的PSR规范
 273 |     </a>
 274 |   </h2>
 275 | 
 276 | 
 277 |       
 278 |       <div class='new-meta-box'>
 279 |         
 280 |           
 281 |         
 282 |           
 283 |             
 284 |   <div class='new-meta-item author'>
 285 |     
 286 |       <a href="https://jiaobantang.github.io" rel="nofollow">
 287 |         
 288 |           <i class="fas fa-user" aria-hidden="true"></i>
 289 |         
 290 |         <p>搅拌糖</p>
 291 |       </a>
 292 |     
 293 |   </div>
 294 | 
 295 | 
 296 |           
 297 |         
 298 |           
 299 |             <div class="new-meta-item date">
 300 |   <a class='notlink'>
 301 |     <i class="fas fa-calendar-alt" aria-hidden="true"></i>
 302 |     <p>2019-04-02</p>
 303 |   </a>
 304 | </div>
 305 | 
 306 |           
 307 |         
 308 |           
 309 |             
 310 |   
 311 |   <div class='new-meta-item category'>
 312 |     <a href='/categories/Coding/PSR/' rel="nofollow">
 313 |       <i class="fas fa-folder-open" aria-hidden="true"></i>
 314 |       <p>Coding&nbsp;/&nbsp;PSR</p>
 315 |     </a>
 316 |   </div>
 317 | 
 318 | 
 319 |           
 320 |         
 321 |           
 322 |             
 323 | 
 324 |           
 325 |         
 326 |       </div>
 327 |       
 328 |         <hr>
 329 |       
 330 |     </div>
 331 |   </section>
 332 | 
 333 | 
 334 |   <section class="article typo ">
 335 |     <div class="article-entry" itemprop="articleBody">
 336 |       PSR规范
 337 |       
 338 |         <div class="readmore">
 339 |           <a href="/2019/04/02/php-coding/" class="flat-box">
 340 |             <i class="fas fa-book-open fa-fw" aria-hidden="true"></i>
 341 |             阅读全文
 342 |           </a>
 343 |         </div>
 344 |       
 345 |     </div>
 346 |     
 347 |       <div class="full-width auto-padding tags">
 348 |         
 349 |           <a href="/tags/Coding/" rel="nofollow"><i class="fas fa-tag fa-fw"></i> Coding</a>
 350 |         
 351 |       </div>
 352 |     
 353 |   </section>
 354 | </article>
 355 | 
 356 |           </div>
 357 |         
 358 |       
 359 |     
 360 |   </section>
 361 |   
 362 |     
 363 |     <!-- 根据主题中的设置决定是否在archive中针对摘要部分的MathJax公式加载mathjax.js文件 -->
 364 |     
 365 |     
 366 | 
 367 |   
 368 | 
 369 | 
 370 |     
 371 |   
 372 | 
 373 | </div>
 374 | <aside class='l_side'>
 375 |   
 376 |     
 377 |     
 378 |       
 379 |       
 380 |         
 381 |           
 382 |           
 383 |             
 384 |               <section class='widget shake author'>
 385 |   <div class='content pure'>
 386 |     
 387 |       <div class='avatar'>
 388 |         <img class='avatar' src='http://cdn.treelo.xin/avatar.png'/>
 389 |       </div>
 390 |     
 391 |     
 392 |     
 393 |       <div class="social-wrapper">
 394 |         
 395 |           
 396 |             <a href="/mailto:847280718@qq.com"
 397 |               class="social fas fa-envelope flat-btn"
 398 |               target="_blank"
 399 |               rel="external nofollow noopener noreferrer">
 400 |             </a>
 401 |           
 402 |         
 403 |           
 404 |             <a href="https://github.com/JIAOBANTANG"
 405 |               class="social fab fa-github flat-btn"
 406 |               target="_blank"
 407 |               rel="external nofollow noopener noreferrer">
 408 |             </a>
 409 |           
 410 |         
 411 |           
 412 |             <a href="https://codepen.io/jiaobantang/pens/public/"
 413 |               class="social fab fa-codepen flat-btn"
 414 |               target="_blank"
 415 |               rel="external nofollow noopener noreferrer">
 416 |             </a>
 417 |           
 418 |         
 419 |           
 420 |             <a href="https://music.163.com/#/user/home?id=65219633"
 421 |               class="social fas fa-headphones-alt flat-btn"
 422 |               target="_blank"
 423 |               rel="external nofollow noopener noreferrer">
 424 |             </a>
 425 |           
 426 |         
 427 |       </div>
 428 |     
 429 |   </div>
 430 | </section>
 431 | 
 432 |             
 433 |           
 434 |         
 435 |           
 436 |           
 437 |         
 438 |           
 439 |           
 440 |         
 441 |           
 442 |           
 443 |         
 444 |           
 445 |           
 446 |         
 447 |           
 448 |           
 449 |         
 450 |       
 451 |         
 452 |           
 453 |           
 454 |         
 455 |           
 456 |           
 457 |         
 458 |           
 459 |           
 460 |         
 461 |           
 462 |           
 463 |         
 464 |           
 465 |           
 466 |         
 467 |           
 468 |           
 469 |             
 470 |               <section class='widget list'>
 471 |   
 472 | <header class='pure'>
 473 |   <div><i class="fas fa-thumbs-up fa-fw" aria-hidden="true"></i>&nbsp;&nbsp;强烈推荐</div>
 474 |   
 475 | </header>
 476 | 
 477 |   <div class='content pure'>
 478 |     <ul class="entry">
 479 |       
 480 |         <li><a class="flat-box" title="/2019/06/09/photo-map/" href="/2019/06/09/photo-map/"
 481 |           
 482 |           
 483 |           >
 484 |           <div class='name'>
 485 |             
 486 |               <i class=" fa-fw" aria-hidden="true"></i>
 487 |             
 488 |             &nbsp;&nbsp;地图相册
 489 |           </div>
 490 |           
 491 |         </a></li>
 492 |       
 493 |     </ul>
 494 |   </div>
 495 | </section>
 496 | 
 497 |             
 498 |           
 499 |         
 500 |       
 501 |         
 502 |           
 503 |           
 504 |         
 505 |           
 506 |           
 507 |         
 508 |           
 509 |           
 510 |             
 511 |               <section class='widget grid'>
 512 |   
 513 | <header class='pure'>
 514 |   <div><i class="fas fa-map-signs fa-fw" aria-hidden="true"></i>&nbsp;&nbsp;站内导航</div>
 515 |   
 516 | </header>
 517 | 
 518 |   <div class='content pure'>
 519 |     <ul class="grid navgation">
 520 |       
 521 |         <li><a class="flat-box" title="/" href="/"
 522 |           
 523 |           
 524 |           id="home">
 525 |           
 526 |             <i class="fas fa-clock fa-fw" aria-hidden="true"></i>
 527 |           
 528 |           近期文章
 529 |         </a></li>
 530 |       
 531 |         <li><a class="flat-box" title="/archives/" href="/archives/"
 532 |           
 533 |             rel="nofollow"
 534 |           
 535 |           
 536 |           id="archives">
 537 |           
 538 |             <i class="fas fa-archive fa-fw" aria-hidden="true"></i>
 539 |           
 540 |           文章归档
 541 |         </a></li>
 542 |       
 543 |         <li><a class="flat-box" title="/projects/" href="/projects/"
 544 |           
 545 |           
 546 |           id="projects">
 547 |           
 548 |             <i class="fas fa-code-branch fa-fw" aria-hidden="true"></i>
 549 |           
 550 |           开源项目
 551 |         </a></li>
 552 |       
 553 |         <li><a class="flat-box" title="/friends/" href="/friends/"
 554 |           
 555 |             rel="nofollow"
 556 |           
 557 |           
 558 |           id="friends">
 559 |           
 560 |             <i class="fas fa-link fa-fw" aria-hidden="true"></i>
 561 |           
 562 |           我的友链
 563 |         </a></li>
 564 |       
 565 |         <li><a class="flat-box" title="/about/" href="/about/"
 566 |           
 567 |             rel="nofollow"
 568 |           
 569 |           
 570 |           id="about">
 571 |           
 572 |             <i class="fas fa-info-circle fa-fw" aria-hidden="true"></i>
 573 |           
 574 |           关于小站
 575 |         </a></li>
 576 |       
 577 |     </ul>
 578 |   </div>
 579 | </section>
 580 | 
 581 |             
 582 |           
 583 |         
 584 |           
 585 |           
 586 |         
 587 |           
 588 |           
 589 |         
 590 |           
 591 |           
 592 |         
 593 |       
 594 |         
 595 |           
 596 |           
 597 |         
 598 |           
 599 |           
 600 |         
 601 |           
 602 |           
 603 |         
 604 |           
 605 |           
 606 |             
 607 |               
 608 |   <section class='widget category'>
 609 |     
 610 | <header class='pure'>
 611 |   <div><i class="fas fa-folder-open fa-fw" aria-hidden="true"></i>&nbsp;&nbsp;文章分类</div>
 612 |   
 613 |     <a class="rightBtn"
 614 |     
 615 |       rel="nofollow"
 616 |     
 617 |     
 618 |     href="/blog/categories/"
 619 |     title="blog/categories/">
 620 |     <i class="fas fa-expand-arrows-alt fa-fw"></i></a>
 621 |   
 622 | </header>
 623 | 
 624 |     <div class='content pure'>
 625 |       <ul class="entry">
 626 |         
 627 |           <li><a class="flat-box" title="/categories/Coding/" href="/categories/Coding/"><div class='name'>Coding</div><div class='badge'>(19)</div></a></li>
 628 |         
 629 |           <li><a class="flat-box child" title="/categories/Coding/Design/" href="/categories/Coding/Design/"><div class='name'>Design</div><div class='badge'>(1)</div></a></li>
 630 |         
 631 |           <li><a class="flat-box child" title="/categories/Coding/Docker/" href="/categories/Coding/Docker/"><div class='name'>Docker</div><div class='badge'>(5)</div></a></li>
 632 |         
 633 |           <li><a class="flat-box child" title="/categories/Coding/JS/" href="/categories/Coding/JS/"><div class='name'>JS</div><div class='badge'>(1)</div></a></li>
 634 |         
 635 |           <li><a class="flat-box child" title="/categories/Coding/MySQL/" href="/categories/Coding/MySQL/"><div class='name'>MySQL</div><div class='badge'>(3)</div></a></li>
 636 |         
 637 |           <li><a class="flat-box child" title="/categories/Coding/PHP/" href="/categories/Coding/PHP/"><div class='name'>PHP</div><div class='badge'>(2)</div></a></li>
 638 |         
 639 |           <li><a class="flat-box child" title="/categories/Coding/PSR/" href="/categories/Coding/PSR/"><div class='name'>PSR</div><div class='badge'>(1)</div></a></li>
 640 |         
 641 |           <li><a class="flat-box child" title="/categories/Coding/Swoole/" href="/categories/Coding/Swoole/"><div class='name'>Swoole</div><div class='badge'>(1)</div></a></li>
 642 |         
 643 |           <li><a class="flat-box child" title="/categories/Coding/Web/" href="/categories/Coding/Web/"><div class='name'>Web</div><div class='badge'>(3)</div></a></li>
 644 |         
 645 |           <li><a class="flat-box" title="/categories/PHP/" href="/categories/PHP/"><div class='name'>PHP</div><div class='badge'>(1)</div></a></li>
 646 |         
 647 |           <li><a class="flat-box" title="/categories/Self/" href="/categories/Self/"><div class='name'>Self</div><div class='badge'>(1)</div></a></li>
 648 |         
 649 |           <li><a class="flat-box" title="/categories/%E8%A1%80%E5%B0%8F%E6%9D%BF/" href="/categories/%E8%A1%80%E5%B0%8F%E6%9D%BF/"><div class='name'>血小板</div><div class='badge'>(1)</div></a></li>
 650 |         
 651 |       </ul>
 652 |     </div>
 653 |   </section>
 654 | 
 655 | 
 656 |             
 657 |           
 658 |         
 659 |           
 660 |           
 661 |         
 662 |           
 663 |           
 664 |         
 665 |       
 666 |         
 667 |           
 668 |           
 669 |         
 670 |           
 671 |           
 672 |         
 673 |           
 674 |           
 675 |         
 676 |           
 677 |           
 678 |         
 679 |           
 680 |           
 681 |             
 682 |               
 683 |   <section class='widget tagcloud'>
 684 |     
 685 | <header class='pure'>
 686 |   <div><i class="fas fa-tags fa-fw" aria-hidden="true"></i>&nbsp;&nbsp;热门标签</div>
 687 |   
 688 |     <a class="rightBtn"
 689 |     
 690 |       rel="nofollow"
 691 |     
 692 |     
 693 |     href="/blog/tags/"
 694 |     title="blog/tags/">
 695 |     <i class="fas fa-expand-arrows-alt fa-fw"></i></a>
 696 |   
 697 | </header>
 698 | 
 699 |     <div class='content pure'>
 700 |       <a href="/tags/Coding/" style="font-size: 20.67px; color: #6c6c6c">Coding</a> <a href="/tags/Cool/" style="font-size: 14px; color: #999">Cool</a> <a href="/tags/JavaScript/" style="font-size: 14px; color: #999">JavaScript</a> <a href="/tags/MySQL/" style="font-size: 17.33px; color: #828282">MySQL</a> <a href="/tags/OOP/" style="font-size: 14px; color: #999">OOP</a> <a href="/tags/PDO/" style="font-size: 14px; color: #999">PDO</a> <a href="/tags/PHP/" style="font-size: 14px; color: #999">PHP</a> <a href="/tags/Swoole/" style="font-size: 14px; color: #999">Swoole</a> <a href="/tags/docker/" style="font-size: 24px; color: #555">docker</a> <a href="/tags/live2D/" style="font-size: 14px; color: #999">live2D</a> <a href="/tags/nginx/" style="font-size: 14px; color: #999">nginx</a> <a href="/tags/php/" style="font-size: 14px; color: #999">php</a> <a href="/tags/snowflake/" style="font-size: 14px; color: #999">snowflake</a> <a href="/tags/%E5%9C%B0%E5%9B%BE%E7%9B%B8%E5%86%8C/" style="font-size: 14px; color: #999">地图相册</a> <a href="/tags/%E6%8E%A5%E5%8F%A3%E5%BC%80%E5%8F%91/" style="font-size: 14px; color: #999">接口开发</a> <a href="/tags/%E6%94%B9%E5%8F%98/" style="font-size: 14px; color: #999">改变</a> <a href="/tags/%E6%97%A5%E7%AD%BE/" style="font-size: 14px; color: #999">日签</a> <a href="/tags/%E6%9C%8D%E5%8A%A1%E7%AB%AF/" style="font-size: 14px; color: #999">服务端</a> <a href="/tags/%E7%B3%96%E7%B3%96%E6%97%A5%E7%AD%BE/" style="font-size: 14px; color: #999">糖糖日签</a> <a href="/tags/%E8%87%AA%E6%88%91%E5%8F%91%E5%B1%95/" style="font-size: 14px; color: #999">自我发展</a> <a href="/tags/%E8%A1%80%E5%B0%8F%E6%9D%BF/" style="font-size: 14px; color: #999">血小板</a> <a href="/tags/%E8%AE%BE%E8%AE%A1%E6%A8%A1%E5%BC%8F/" style="font-size: 14px; color: #999">设计模式</a>
 701 |     </div>
 702 |   </section>
 703 | 
 704 | 
 705 |             
 706 |           
 707 |         
 708 |           
 709 |           
 710 |         
 711 |       
 712 |     
 713 | 
 714 |   
 715 | </aside>
 716 | 
 717 | <footer id="footer" class="clearfix">
 718 |   
 719 |   
 720 |     <div class="social-wrapper">
 721 |       
 722 |         
 723 |           <a href="/mailto:847280718@qq.com"
 724 |             class="social fas fa-envelope flat-btn"
 725 |             target="_blank"
 726 |             rel="external nofollow noopener noreferrer">
 727 |           </a>
 728 |         
 729 |       
 730 |         
 731 |           <a href="https://github.com/JIAOBANTANG"
 732 |             class="social fab fa-github flat-btn"
 733 |             target="_blank"
 734 |             rel="external nofollow noopener noreferrer">
 735 |           </a>
 736 |         
 737 |       
 738 |         
 739 |           <a href="https://codepen.io/jiaobantang/pens/public/"
 740 |             class="social fab fa-codepen flat-btn"
 741 |             target="_blank"
 742 |             rel="external nofollow noopener noreferrer">
 743 |           </a>
 744 |         
 745 |       
 746 |         
 747 |           <a href="https://music.163.com/#/user/home?id=65219633"
 748 |             class="social fas fa-headphones-alt flat-btn"
 749 |             target="_blank"
 750 |             rel="external nofollow noopener noreferrer">
 751 |           </a>
 752 |         
 753 |       
 754 |     </div>
 755 |   
 756 |   <br>
 757 |   <div>
 758 |     <div class="footer">
 759 |       <p><span style="color:rgb(61, 197, 80);">种一棵树最好的时间是十年前，其次是现在</span></p>
 760 | 
 761 |     </div>
 762 | 
 763 |   </div>
 764 |   <!-- <div><p>Blog content follows the <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/deed.en" target="_blank" rel="noopener">Attribution-NonCommercial-ShareAlike 4.0 International (CC BY-NC-SA 4.0) License</a></p>
 765 | </div> -->
 766 |   <div>
 767 |     本站使用
 768 |     <a href="https://xaoxuu.com/wiki/material-x/" target="_blank" class="codename">Material X</a>
 769 |     作为主题
 770 |     
 771 |       ，
 772 |       总访问量为
 773 |       <span id="busuanzi_value_site_pv"><i class="fas fa-spinner fa-spin fa-fw" aria-hidden="true"></i></span>
 774 |       次
 775 |     
 776 |     。
 777 |   </div>
 778 |   <div id="sitetime"></div>
 779 | </footer>
 780 | <script>setLoadingBarProgress(80);</script>
 781 | <script src="https://cdn.bootcss.com/jquery/3.3.0/jquery.min.js"></script>
 782 | <!-- 血小板 -->
 783 | <div id="landlord">
 784 |   <div class="message" style="opacity:0"></div>
 785 |   <canvas id="live2d" width="560" height="500" class="live2d"></canvas>
 786 |   <div class="hide-button">隐藏</div>
 787 | </div>
 788 | <!-- 血小板-->
 789 | <script type="text/javascript">
 790 |   var message_Path = '/live2d/'
 791 | </script>
 792 | <script type="text/javascript" src="/live2d/js/live2d.js"></script>
 793 | <script type="text/javascript" src="/live2d/js/message.js"></script>
 794 | <script type="text/javascript">
 795 |   loadlive2d("live2d", "/live2d/model/xiaoban/model.json");
 796 | </script>
 797 | <!-- 点击特效，输入特效 运行时间 -->
 798 | <script type="text/javascript" src="/cool/cooltext.js"></script>
 799 | <script type="text/javascript" src="/cool/clicklove.js"></script>
 800 | <script type="text/javascript" src="/cool/sitetime.js"></script>
 801 | <script type="text/javascript" src="/cool/banner.js"></script>
 802 | 
 803 | 
 804 |       <script>setLoadingBarProgress(60);</script>
 805 |     </div>
 806 |     <a class="s-top fas fa-arrow-up fa-fw" href='javascript:void(0)' target="_blank" rel="noopener"></a>
 807 |   </div>
 808 |   <script src="https://cdn.jsdelivr.net/npm/jquery@3.3.1/dist/jquery.min.js"></script>
 809 | 
 810 |   <script>
 811 |     var GOOGLE_CUSTOM_SEARCH_API_KEY = "";
 812 |     var GOOGLE_CUSTOM_SEARCH_ENGINE_ID = "";
 813 |     var ALGOLIA_API_KEY = "";
 814 |     var ALGOLIA_APP_ID = "";
 815 |     var ALGOLIA_INDEX_NAME = "";
 816 |     var AZURE_SERVICE_NAME = "";
 817 |     var AZURE_INDEX_NAME = "";
 818 |     var AZURE_QUERY_KEY = "";
 819 |     var BAIDU_API_ID = "";
 820 |     var SEARCH_SERVICE = "hexo" || "hexo";
 821 |     var ROOT = "/"||"/";
 822 |     if(!ROOT.endsWith('/'))ROOT += '/';
 823 |   </script>
 824 | 
 825 | <script src="//instant.page/1.2.2" type="module" integrity="sha384-2xV8M5griQmzyiY3CDqh1dn4z3llDVqZDqzjzcY+jCBCk/a5fXJmuZ/40JJAPeoU"></script>
 826 | 
 827 | 
 828 |   <script async src="https://cdn.jsdelivr.net/npm/scrollreveal@4.0.5/dist/scrollreveal.min.js"></script>
 829 |   <script type="text/javascript">
 830 |     $(function() {
 831 |       const $reveal = $('.reveal');
 832 |       if ($reveal.length === 0) return;
 833 |       const sr = ScrollReveal({ distance: 0 });
 834 |       sr.reveal('.reveal');
 835 |     });
 836 |   </script>
 837 | 
 838 | 
 839 |   <script src="https://cdn.jsdelivr.net/npm/node-waves@0.7.6/dist/waves.min.js"></script>
 840 |   <script type="text/javascript">
 841 |     $(function() {
 842 |       Waves.attach('.flat-btn', ['waves-button']);
 843 |       Waves.attach('.float-btn', ['waves-button', 'waves-float']);
 844 |       Waves.attach('.float-btn-light', ['waves-button', 'waves-float', 'waves-light']);
 845 |       Waves.attach('.flat-box', ['waves-block']);
 846 |       Waves.attach('.float-box', ['waves-block', 'waves-float']);
 847 |       Waves.attach('.waves-image');
 848 |       Waves.init();
 849 |     });
 850 |   </script>
 851 | 
 852 | 
 853 |   <script async src="https://cdn.jsdelivr.net/gh/xaoxuu/cdn-busuanzi@2.3/js/busuanzi.pure.mini.js"></script>
 854 | 
 855 | 
 856 | 
 857 | 
 858 |   
 859 |   
 860 |   
 861 |     <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-backstretch/2.0.4/jquery.backstretch.min.js"></script>
 862 |     <script type="text/javascript">
 863 |       $(function(){
 864 |         if ('.cover') {
 865 |           $('.cover').backstretch(
 866 |           ["https://img.vim-cn.com/29/91197b04c13f512f734a76d4ac422d89dbe229.jpg"],
 867 |           {
 868 |             duration: "6000",
 869 |             fade: "2500"
 870 |           });
 871 |         } else {
 872 |           $.backstretch(
 873 |           ["https://img.vim-cn.com/29/91197b04c13f512f734a76d4ac422d89dbe229.jpg"],
 874 |           {
 875 |             duration: "6000",
 876 |             fade: "2500"
 877 |           });
 878 |         }
 879 |       });
 880 |     </script>
 881 |   
 882 | 
 883 | 
 884 | 
 885 | 
 886 | 
 887 | 
 888 | 
 889 | 
 890 | 
 891 | 
 892 | 
 893 |   <script src="https://cdn.jsdelivr.net/gh/xaoxuu/cdn-material-x@19.9/js/app.js"></script>
 894 | 
 895 | 
 896 |   <script src="https://cdn.jsdelivr.net/gh/xaoxuu/cdn-material-x@19.9/js/search.js"></script>
 897 | 
 898 | 
 899 | 
 900 | 
 901 | <!-- 复制 -->
 902 | <script src="https://cdn.jsdelivr.net/npm/clipboard@2/dist/clipboard.min.js"></script>
 903 | <script>
 904 |   let COPY_SUCCESS = "复制成功";
 905 |   let COPY_FAILURE = "复制失败";
 906 |   /*页面载入完成后，创建复制按钮*/
 907 |   !function (e, t, a) {
 908 |     /* code */
 909 |     var initCopyCode = function(){
 910 |       var copyHtml = '';
 911 |       copyHtml += '<button class="btn-copy" data-clipboard-snippet="">';
 912 |       copyHtml += '  <i class="fa fa-copy"></i><span>复制</span>';
 913 |       copyHtml += '</button>';
 914 |       $(".highlight .code pre").before(copyHtml);
 915 |       var clipboard = new ClipboardJS('.btn-copy', {
 916 |         target: function(trigger) {
 917 |           return trigger.nextElementSibling;
 918 |         }
 919 |       });
 920 | 
 921 |       clipboard.on('success', function(e) {
 922 |         //您可以加入成功提示
 923 |         console.info('Action:', e.action);
 924 |         console.info('Text:', e.text);
 925 |         console.info('Trigger:', e.trigger);
 926 |         success_prompt(COPY_SUCCESS);
 927 |         e.clearSelection();
 928 |       });
 929 |       clipboard.on('error', function(e) {
 930 |         //您可以加入失败提示
 931 |         console.error('Action:', e.action);
 932 |         console.error('Trigger:', e.trigger);
 933 |         fail_prompt(COPY_FAILURE);
 934 |       });
 935 |     }
 936 |     initCopyCode();
 937 | 
 938 |   }(window, document);
 939 | 
 940 |   /**
 941 |    * 弹出式提示框，默认1.5秒自动消失
 942 |    * @param message 提示信息
 943 |    * @param style 提示样式，有alert-success、alert-danger、alert-warning、alert-info
 944 |    * @param time 消失时间
 945 |    */
 946 |   var prompt = function (message, style, time)
 947 |   {
 948 |       style = (style === undefined) ? 'alert-success' : style;
 949 |       time = (time === undefined) ? 1500 : time*1000;
 950 |       $('<div>')
 951 |           .appendTo('body')
 952 |           .addClass('alert ' + style)
 953 |           .html(message)
 954 |           .show()
 955 |           .delay(time)
 956 |           .fadeOut();
 957 |   };
 958 | 
 959 |   // 成功提示
 960 |   var success_prompt = function(message, time)
 961 |   {
 962 |       prompt(message, 'alert-success', time);
 963 |   };
 964 | 
 965 |   // 失败提示
 966 |   var fail_prompt = function(message, time)
 967 |   {
 968 |       prompt(message, 'alert-danger', time);
 969 |   };
 970 | 
 971 |   // 提醒
 972 |   var warning_prompt = function(message, time)
 973 |   {
 974 |       prompt(message, 'alert-warning', time);
 975 |   };
 976 | 
 977 |   // 信息提示
 978 |   var info_prompt = function(message, time)
 979 |   {
 980 |       prompt(message, 'alert-info', time);
 981 |   };
 982 | 
 983 | </script>
 984 | 
 985 | 
 986 | <!-- fancybox -->
 987 | <script src="https://cdn.jsdelivr.net/gh/fancyapps/fancybox@3.5.7/dist/jquery.fancybox.min.js"></script>
 988 | <script>
 989 |   let LAZY_LOAD_IMAGE = "";
 990 |   $(".article-entry").find("fancybox").find("img").each(function () {
 991 |       var element = document.createElement("a");
 992 |       $(element).attr("data-fancybox", "gallery");
 993 |       $(element).attr("href", $(this).attr("src"));
 994 |       /* 图片采用懒加载处理时,
 995 |        * 一般图片标签内会有个属性名来存放图片的真实地址，比如 data-original,
 996 |        * 那么此处将原本的属性名src替换为对应属性名data-original,
 997 |        * 修改如下
 998 |        */
 999 |        if (LAZY_LOAD_IMAGE) {
1000 |          $(element).attr("href", $(this).attr("data-original"));
1001 |        }
1002 |       $(this).wrap(element);
1003 |   });
1004 | </script>
1005 | 
1006 | 
1007 | 
1008 | 
1009 | 
1010 |   <script>setLoadingBarProgress(100);</script>
1011 | </body>
1012 | </html>
1013 | 


--------------------------------------------------------------------------------
/tags/Cool/index.html:
--------------------------------------------------------------------------------
   1 | <!DOCTYPE html>
   2 | <html>
   3 | <head>
   4 |   <meta charset="utf-8">
   5 |   <meta http-equiv="X-UA-Compatible" content="IE=edge" />
   6 |   
   7 |   <title>Tag: Cool | 搅拌糖</title>
   8 |   
   9 |   <meta name="keywords" content="搅拌糖,搅拌糖°,搅拌糖的个人博客">
  10 |   
  11 |   
  12 |   <meta name="description" content="种一棵树最好的时间是十年前，其次是现在">
  13 |   
  14 | 
  15 |   
  16 |   <link rel="shortcut icon" type="image/ico" href="/favicon.ico"/>
  17 |   <meta name="HandheldFriendly" content="True" />
  18 |   <meta name="apple-mobile-web-app-capable" content="yes">
  19 |   <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  20 |   <!-- meta -->
  21 |   
  22 | 
  23 |   <!-- link -->
  24 |   <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/fancyapps/fancybox@3.5.7/dist/jquery.fancybox.min.css" />
  25 |   
  26 |   <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/node-waves@0.7.6/dist/waves.min.css">
  27 |   
  28 |   <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@5.10.1/css/all.min.css">
  29 |   
  30 | 
  31 |   
  32 | 
  33 |   
  34 |     <link rel="stylesheet" href="/style.css">
  35 |   
  36 | 
  37 |   <script>
  38 |     function setLoadingBarProgress(num) {
  39 |       document.getElementById('loading-bar').style.width=num+"%";
  40 |     }
  41 |   </script>
  42 | 
  43 |   
  44 |   
  45 |   <!-- 血小板-->
  46 | <link rel="stylesheet" href="/live2d/css/live2d.css" />
  47 | </head>
  48 | 
  49 | <body>
  50 |   
  51 |   
  52 |   <div class="cover-wrapper">
  53 |     <cover class='cover  half'>
  54 |       
  55 |         
  56 |   <img class='logo shake' src='http://cdn.treelo.xin/avatar.png'/>
  57 | 
  58 | 
  59 |   <div class="m_search">
  60 |     <form name="searchform" class="form u-search-form">
  61 |       <input type="text" class="input u-search-input" placeholder="" />
  62 |       <i class="icon fas fa-search fa-fw"></i>
  63 |     </form>
  64 |   </div>
  65 | 
  66 | <div class='menu navgation'>
  67 |   <ul class='h-list'>
  68 |     
  69 |       
  70 |         <li>
  71 |           <a class="nav home" href="/"
  72 |             
  73 |             
  74 |             id="home">
  75 |             <i class='fas fa-rss fa-fw'></i>&nbsp;博文
  76 |           </a>
  77 |         </li>
  78 |       
  79 |         <li>
  80 |           <a class="nav home" href="/projects/"
  81 |             
  82 |             
  83 |             id="projects">
  84 |             <i class='fas fa-code-branch fa-fw'></i>&nbsp;项目
  85 |           </a>
  86 |         </li>
  87 |       
  88 |         <li>
  89 |           <a class="nav home" href="/friends/"
  90 |             
  91 |               rel="nofollow"
  92 |             
  93 |             
  94 |             id="friends">
  95 |             <i class='fas fa-link fa-fw'></i>&nbsp;友链
  96 |           </a>
  97 |         </li>
  98 |       
  99 |         <li>
 100 |           <a class="nav home" href="/about/"
 101 |             
 102 |               rel="nofollow"
 103 |             
 104 |             
 105 |             id="about">
 106 |             <i class='fas fa-info-circle fa-fw'></i>&nbsp;关于
 107 |           </a>
 108 |         </li>
 109 |       
 110 |     
 111 |   </ul>
 112 | </div>
 113 | 
 114 |       
 115 |     </cover>
 116 |     <header class="l_header pure">
 117 |   <div id="loading-bar-wrapper">
 118 |     <div id="loading-bar" class="pure"></div>
 119 |   </div>
 120 | 
 121 | 	<div class='wrapper'>
 122 | 		<div class="nav-main container container--flex">
 123 |       <a class="logo flat-box" href='/' >
 124 |         
 125 |           搅拌糖
 126 |         
 127 |       </a>
 128 | 			<div class='menu navgation'>
 129 | 				<ul class='h-list'>
 130 |           
 131 |   					
 132 |   						<li>
 133 | 								<a class="nav flat-box" href="/"
 134 |                   
 135 |                   
 136 |                   id="home">
 137 | 									<i class='fas fa-shapes fa-fw'></i>&nbsp;博客
 138 | 								</a>
 139 | 							</li>
 140 |       			
 141 |   						<li>
 142 | 								<a class="nav flat-box" href="/categories/"
 143 |                   
 144 |                     rel="nofollow"
 145 |                   
 146 |                   
 147 |                   id="categories">
 148 | 									<i class='fas fa-calendar-alt fa-fw'></i>&nbsp;归档
 149 | 								</a>
 150 | 							</li>
 151 |       			
 152 |   						<li>
 153 | 								<a class="nav flat-box" href="/2018/11/11/message/"
 154 |                   
 155 |                     rel="nofollow"
 156 |                   
 157 |                   
 158 |                   id="20181111message">
 159 | 									<i class='fas fa-comment-alt fa-fw'></i>&nbsp;留言
 160 | 								</a>
 161 | 							</li>
 162 |       			
 163 |       		
 164 | 				</ul>
 165 | 			</div>
 166 | 
 167 | 			
 168 | 				<div class="m_search">
 169 | 					<form name="searchform" class="form u-search-form">
 170 | 						<input type="text" class="input u-search-input" placeholder="搜索" />
 171 | 						<i class="icon fas fa-search fa-fw"></i>
 172 | 					</form>
 173 | 				</div>
 174 | 			
 175 | 			<ul class='switcher h-list'>
 176 | 				
 177 | 					<li class='s-search'><a class="fas fa-search fa-fw" href='javascript:void(0)' target="_blank" rel="noopener"></a></li>
 178 | 				
 179 | 				<li class='s-menu'><a class="fas fa-bars fa-fw" href='javascript:void(0)' target="_blank" rel="noopener"></a></li>
 180 | 			</ul>
 181 | 		</div>
 182 | 
 183 | 		<div class='nav-sub container container--flex'>
 184 | 			<a class="logo flat-box"></a>
 185 | 			<ul class='switcher h-list'>
 186 | 				<li class='s-comment'><a class="flat-btn fas fa-comments fa-fw" href='javascript:void(0)' target="_blank" rel="noopener"></a></li>
 187 |         
 188 |           <li class='s-toc'><a class="flat-btn fas fa-list fa-fw" href='javascript:void(0)' target="_blank" rel="noopener"></a></li>
 189 |         
 190 | 			</ul>
 191 | 		</div>
 192 | 	</div>
 193 | </header>
 194 | 	<aside class="menu-phone">
 195 |     <header>
 196 | 		<nav class="menu navgation">
 197 |       <ul>
 198 |         
 199 |           
 200 |             <li>
 201 | 							<a class="nav flat-box" href="/"
 202 |                 
 203 |                 
 204 |                 id="home">
 205 | 								<i class='fas fa-shapes fa-fw'></i>&nbsp;博客
 206 | 							</a>
 207 |             </li>
 208 |           
 209 |             <li>
 210 | 							<a class="nav flat-box" href="/categories/"
 211 |                 
 212 |                   rel="nofollow"
 213 |                 
 214 |                 
 215 |                 id="categories">
 216 | 								<i class='fas fa-calendar-alt fa-fw'></i>&nbsp;归档
 217 | 							</a>
 218 |             </li>
 219 |           
 220 |             <li>
 221 | 							<a class="nav flat-box" href="/2018/11/11/message/"
 222 |                 
 223 |                   rel="nofollow"
 224 |                 
 225 |                 
 226 |                 id="20181111message">
 227 | 								<i class='fas fa-comment-alt fa-fw'></i>&nbsp;留言
 228 | 							</a>
 229 |             </li>
 230 |           
 231 |        
 232 |       </ul>
 233 | 		</nav>
 234 |     </header>
 235 | 	</aside>
 236 | <script>setLoadingBarProgress(40);</script>
 237 | 
 238 |   </div>
 239 | 
 240 | 
 241 |   <div class="l_body">
 242 |     <div class='body-wrapper'>
 243 |       
 244 | <div class='l_main'>
 245 |   
 246 |     
 247 |       
 248 |   <section class="post-list">
 249 |     
 250 |       
 251 |         
 252 |           
 253 |         
 254 |       
 255 |     
 256 |     
 257 |       
 258 |         
 259 |           <div class='post-wrapper'>
 260 |             <article class="post reveal banner ">
 261 |   
 262 | 
 263 | 
 264 |   <section class='meta'>
 265 |     
 266 |     
 267 |     <div class="meta" id="header-meta">
 268 |       
 269 |         
 270 |   <h2 class="title">
 271 |     <a href="/2019/05/12/themes-custom/">
 272 |       Hexo博客Material-X主题个性化
 273 |     </a>
 274 |   </h2>
 275 | 
 276 | 
 277 |       
 278 |       <div class='new-meta-box'>
 279 |         
 280 |           
 281 |         
 282 |           
 283 |             
 284 |   <div class='new-meta-item author'>
 285 |     
 286 |       <a href="https://jiaobantang.github.io" rel="nofollow">
 287 |         
 288 |           <i class="fas fa-user" aria-hidden="true"></i>
 289 |         
 290 |         <p>搅拌糖</p>
 291 |       </a>
 292 |     
 293 |   </div>
 294 | 
 295 | 
 296 |           
 297 |         
 298 |           
 299 |             <div class="new-meta-item date">
 300 |   <a class='notlink'>
 301 |     <i class="fas fa-calendar-alt" aria-hidden="true"></i>
 302 |     <p>2019-05-12</p>
 303 |   </a>
 304 | </div>
 305 | 
 306 |           
 307 |         
 308 |           
 309 |             
 310 |   
 311 |   <div class='new-meta-item category'>
 312 |     <a href='/categories/Coding/Web/' rel="nofollow">
 313 |       <i class="fas fa-folder-open" aria-hidden="true"></i>
 314 |       <p>Coding&nbsp;/&nbsp;Web</p>
 315 |     </a>
 316 |   </div>
 317 | 
 318 | 
 319 |           
 320 |         
 321 |           
 322 |             
 323 | 
 324 |           
 325 |         
 326 |       </div>
 327 |       
 328 |         <hr>
 329 |       
 330 |     </div>
 331 |   </section>
 332 | 
 333 | 
 334 |   <section class="article typo ">
 335 |     <div class="article-entry" itemprop="articleBody">
 336 |       <p>Hexo博客Material-X主题个性化</p>
 337 |       
 338 |         <div class="readmore">
 339 |           <a href="/2019/05/12/themes-custom/" class="flat-box">
 340 |             <i class="fas fa-book-open fa-fw" aria-hidden="true"></i>
 341 |             阅读全文
 342 |           </a>
 343 |         </div>
 344 |       
 345 |     </div>
 346 |     
 347 |       <div class="full-width auto-padding tags">
 348 |         
 349 |           <a href="/tags/Cool/" rel="nofollow"><i class="fas fa-tag fa-fw"></i> Cool</a>
 350 |         
 351 |       </div>
 352 |     
 353 |   </section>
 354 | </article>
 355 | 
 356 |           </div>
 357 |         
 358 |       
 359 |     
 360 |   </section>
 361 |   
 362 |     
 363 |     <!-- 根据主题中的设置决定是否在archive中针对摘要部分的MathJax公式加载mathjax.js文件 -->
 364 |     
 365 |     
 366 | 
 367 |   
 368 | 
 369 | 
 370 |     
 371 |   
 372 | </div>
 373 | <aside class='l_side'>
 374 |   
 375 |     
 376 |     
 377 |       
 378 |       
 379 |         
 380 |           
 381 |           
 382 |             
 383 |               <section class='widget shake author'>
 384 |   <div class='content pure'>
 385 |     
 386 |       <div class='avatar'>
 387 |         <img class='avatar' src='http://cdn.treelo.xin/avatar.png'/>
 388 |       </div>
 389 |     
 390 |     
 391 |     
 392 |       <div class="social-wrapper">
 393 |         
 394 |           
 395 |             <a href="/mailto:847280718@qq.com"
 396 |               class="social fas fa-envelope flat-btn"
 397 |               target="_blank"
 398 |               rel="external nofollow noopener noreferrer">
 399 |             </a>
 400 |           
 401 |         
 402 |           
 403 |             <a href="https://github.com/JIAOBANTANG"
 404 |               class="social fab fa-github flat-btn"
 405 |               target="_blank"
 406 |               rel="external nofollow noopener noreferrer">
 407 |             </a>
 408 |           
 409 |         
 410 |           
 411 |             <a href="https://codepen.io/jiaobantang/pens/public/"
 412 |               class="social fab fa-codepen flat-btn"
 413 |               target="_blank"
 414 |               rel="external nofollow noopener noreferrer">
 415 |             </a>
 416 |           
 417 |         
 418 |           
 419 |             <a href="https://music.163.com/#/user/home?id=65219633"
 420 |               class="social fas fa-headphones-alt flat-btn"
 421 |               target="_blank"
 422 |               rel="external nofollow noopener noreferrer">
 423 |             </a>
 424 |           
 425 |         
 426 |       </div>
 427 |     
 428 |   </div>
 429 | </section>
 430 | 
 431 |             
 432 |           
 433 |         
 434 |           
 435 |           
 436 |         
 437 |           
 438 |           
 439 |         
 440 |           
 441 |           
 442 |         
 443 |           
 444 |           
 445 |         
 446 |           
 447 |           
 448 |         
 449 |       
 450 |         
 451 |           
 452 |           
 453 |         
 454 |           
 455 |           
 456 |         
 457 |           
 458 |           
 459 |         
 460 |           
 461 |           
 462 |         
 463 |           
 464 |           
 465 |         
 466 |           
 467 |           
 468 |             
 469 |               <section class='widget list'>
 470 |   
 471 | <header class='pure'>
 472 |   <div><i class="fas fa-thumbs-up fa-fw" aria-hidden="true"></i>&nbsp;&nbsp;强烈推荐</div>
 473 |   
 474 | </header>
 475 | 
 476 |   <div class='content pure'>
 477 |     <ul class="entry">
 478 |       
 479 |         <li><a class="flat-box" title="/2019/06/09/photo-map/" href="/2019/06/09/photo-map/"
 480 |           
 481 |           
 482 |           >
 483 |           <div class='name'>
 484 |             
 485 |               <i class=" fa-fw" aria-hidden="true"></i>
 486 |             
 487 |             &nbsp;&nbsp;地图相册
 488 |           </div>
 489 |           
 490 |         </a></li>
 491 |       
 492 |     </ul>
 493 |   </div>
 494 | </section>
 495 | 
 496 |             
 497 |           
 498 |         
 499 |       
 500 |         
 501 |           
 502 |           
 503 |         
 504 |           
 505 |           
 506 |         
 507 |           
 508 |           
 509 |             
 510 |               <section class='widget grid'>
 511 |   
 512 | <header class='pure'>
 513 |   <div><i class="fas fa-map-signs fa-fw" aria-hidden="true"></i>&nbsp;&nbsp;站内导航</div>
 514 |   
 515 | </header>
 516 | 
 517 |   <div class='content pure'>
 518 |     <ul class="grid navgation">
 519 |       
 520 |         <li><a class="flat-box" title="/" href="/"
 521 |           
 522 |           
 523 |           id="home">
 524 |           
 525 |             <i class="fas fa-clock fa-fw" aria-hidden="true"></i>
 526 |           
 527 |           近期文章
 528 |         </a></li>
 529 |       
 530 |         <li><a class="flat-box" title="/archives/" href="/archives/"
 531 |           
 532 |             rel="nofollow"
 533 |           
 534 |           
 535 |           id="archives">
 536 |           
 537 |             <i class="fas fa-archive fa-fw" aria-hidden="true"></i>
 538 |           
 539 |           文章归档
 540 |         </a></li>
 541 |       
 542 |         <li><a class="flat-box" title="/projects/" href="/projects/"
 543 |           
 544 |           
 545 |           id="projects">
 546 |           
 547 |             <i class="fas fa-code-branch fa-fw" aria-hidden="true"></i>
 548 |           
 549 |           开源项目
 550 |         </a></li>
 551 |       
 552 |         <li><a class="flat-box" title="/friends/" href="/friends/"
 553 |           
 554 |             rel="nofollow"
 555 |           
 556 |           
 557 |           id="friends">
 558 |           
 559 |             <i class="fas fa-link fa-fw" aria-hidden="true"></i>
 560 |           
 561 |           我的友链
 562 |         </a></li>
 563 |       
 564 |         <li><a class="flat-box" title="/about/" href="/about/"
 565 |           
 566 |             rel="nofollow"
 567 |           
 568 |           
 569 |           id="about">
 570 |           
 571 |             <i class="fas fa-info-circle fa-fw" aria-hidden="true"></i>
 572 |           
 573 |           关于小站
 574 |         </a></li>
 575 |       
 576 |     </ul>
 577 |   </div>
 578 | </section>
 579 | 
 580 |             
 581 |           
 582 |         
 583 |           
 584 |           
 585 |         
 586 |           
 587 |           
 588 |         
 589 |           
 590 |           
 591 |         
 592 |       
 593 |         
 594 |           
 595 |           
 596 |         
 597 |           
 598 |           
 599 |         
 600 |           
 601 |           
 602 |         
 603 |           
 604 |           
 605 |             
 606 |               
 607 |   <section class='widget category'>
 608 |     
 609 | <header class='pure'>
 610 |   <div><i class="fas fa-folder-open fa-fw" aria-hidden="true"></i>&nbsp;&nbsp;文章分类</div>
 611 |   
 612 |     <a class="rightBtn"
 613 |     
 614 |       rel="nofollow"
 615 |     
 616 |     
 617 |     href="/blog/categories/"
 618 |     title="blog/categories/">
 619 |     <i class="fas fa-expand-arrows-alt fa-fw"></i></a>
 620 |   
 621 | </header>
 622 | 
 623 |     <div class='content pure'>
 624 |       <ul class="entry">
 625 |         
 626 |           <li><a class="flat-box" title="/categories/Coding/" href="/categories/Coding/"><div class='name'>Coding</div><div class='badge'>(19)</div></a></li>
 627 |         
 628 |           <li><a class="flat-box child" title="/categories/Coding/Design/" href="/categories/Coding/Design/"><div class='name'>Design</div><div class='badge'>(1)</div></a></li>
 629 |         
 630 |           <li><a class="flat-box child" title="/categories/Coding/Docker/" href="/categories/Coding/Docker/"><div class='name'>Docker</div><div class='badge'>(5)</div></a></li>
 631 |         
 632 |           <li><a class="flat-box child" title="/categories/Coding/JS/" href="/categories/Coding/JS/"><div class='name'>JS</div><div class='badge'>(1)</div></a></li>
 633 |         
 634 |           <li><a class="flat-box child" title="/categories/Coding/MySQL/" href="/categories/Coding/MySQL/"><div class='name'>MySQL</div><div class='badge'>(3)</div></a></li>
 635 |         
 636 |           <li><a class="flat-box child" title="/categories/Coding/PHP/" href="/categories/Coding/PHP/"><div class='name'>PHP</div><div class='badge'>(2)</div></a></li>
 637 |         
 638 |           <li><a class="flat-box child" title="/categories/Coding/PSR/" href="/categories/Coding/PSR/"><div class='name'>PSR</div><div class='badge'>(1)</div></a></li>
 639 |         
 640 |           <li><a class="flat-box child" title="/categories/Coding/Swoole/" href="/categories/Coding/Swoole/"><div class='name'>Swoole</div><div class='badge'>(1)</div></a></li>
 641 |         
 642 |           <li><a class="flat-box child" title="/categories/Coding/Web/" href="/categories/Coding/Web/"><div class='name'>Web</div><div class='badge'>(3)</div></a></li>
 643 |         
 644 |           <li><a class="flat-box" title="/categories/PHP/" href="/categories/PHP/"><div class='name'>PHP</div><div class='badge'>(1)</div></a></li>
 645 |         
 646 |           <li><a class="flat-box" title="/categories/Self/" href="/categories/Self/"><div class='name'>Self</div><div class='badge'>(1)</div></a></li>
 647 |         
 648 |           <li><a class="flat-box" title="/categories/%E8%A1%80%E5%B0%8F%E6%9D%BF/" href="/categories/%E8%A1%80%E5%B0%8F%E6%9D%BF/"><div class='name'>血小板</div><div class='badge'>(1)</div></a></li>
 649 |         
 650 |       </ul>
 651 |     </div>
 652 |   </section>
 653 | 
 654 | 
 655 |             
 656 |           
 657 |         
 658 |           
 659 |           
 660 |         
 661 |           
 662 |           
 663 |         
 664 |       
 665 |         
 666 |           
 667 |           
 668 |         
 669 |           
 670 |           
 671 |         
 672 |           
 673 |           
 674 |         
 675 |           
 676 |           
 677 |         
 678 |           
 679 |           
 680 |             
 681 |               
 682 |   <section class='widget tagcloud'>
 683 |     
 684 | <header class='pure'>
 685 |   <div><i class="fas fa-tags fa-fw" aria-hidden="true"></i>&nbsp;&nbsp;热门标签</div>
 686 |   
 687 |     <a class="rightBtn"
 688 |     
 689 |       rel="nofollow"
 690 |     
 691 |     
 692 |     href="/blog/tags/"
 693 |     title="blog/tags/">
 694 |     <i class="fas fa-expand-arrows-alt fa-fw"></i></a>
 695 |   
 696 | </header>
 697 | 
 698 |     <div class='content pure'>
 699 |       <a href="/tags/Coding/" style="font-size: 20.67px; color: #6c6c6c">Coding</a> <a href="/tags/Cool/" style="font-size: 14px; color: #999">Cool</a> <a href="/tags/JavaScript/" style="font-size: 14px; color: #999">JavaScript</a> <a href="/tags/MySQL/" style="font-size: 17.33px; color: #828282">MySQL</a> <a href="/tags/OOP/" style="font-size: 14px; color: #999">OOP</a> <a href="/tags/PDO/" style="font-size: 14px; color: #999">PDO</a> <a href="/tags/PHP/" style="font-size: 14px; color: #999">PHP</a> <a href="/tags/Swoole/" style="font-size: 14px; color: #999">Swoole</a> <a href="/tags/docker/" style="font-size: 24px; color: #555">docker</a> <a href="/tags/live2D/" style="font-size: 14px; color: #999">live2D</a> <a href="/tags/nginx/" style="font-size: 14px; color: #999">nginx</a> <a href="/tags/php/" style="font-size: 14px; color: #999">php</a> <a href="/tags/snowflake/" style="font-size: 14px; color: #999">snowflake</a> <a href="/tags/%E5%9C%B0%E5%9B%BE%E7%9B%B8%E5%86%8C/" style="font-size: 14px; color: #999">地图相册</a> <a href="/tags/%E6%8E%A5%E5%8F%A3%E5%BC%80%E5%8F%91/" style="font-size: 14px; color: #999">接口开发</a> <a href="/tags/%E6%94%B9%E5%8F%98/" style="font-size: 14px; color: #999">改变</a> <a href="/tags/%E6%97%A5%E7%AD%BE/" style="font-size: 14px; color: #999">日签</a> <a href="/tags/%E6%9C%8D%E5%8A%A1%E7%AB%AF/" style="font-size: 14px; color: #999">服务端</a> <a href="/tags/%E7%B3%96%E7%B3%96%E6%97%A5%E7%AD%BE/" style="font-size: 14px; color: #999">糖糖日签</a> <a href="/tags/%E8%87%AA%E6%88%91%E5%8F%91%E5%B1%95/" style="font-size: 14px; color: #999">自我发展</a> <a href="/tags/%E8%A1%80%E5%B0%8F%E6%9D%BF/" style="font-size: 14px; color: #999">血小板</a> <a href="/tags/%E8%AE%BE%E8%AE%A1%E6%A8%A1%E5%BC%8F/" style="font-size: 14px; color: #999">设计模式</a>
 700 |     </div>
 701 |   </section>
 702 | 
 703 | 
 704 |             
 705 |           
 706 |         
 707 |           
 708 |           
 709 |         
 710 |       
 711 |     
 712 | 
 713 |   
 714 | </aside>
 715 | 
 716 | <footer id="footer" class="clearfix">
 717 |   
 718 |   
 719 |     <div class="social-wrapper">
 720 |       
 721 |         
 722 |           <a href="/mailto:847280718@qq.com"
 723 |             class="social fas fa-envelope flat-btn"
 724 |             target="_blank"
 725 |             rel="external nofollow noopener noreferrer">
 726 |           </a>
 727 |         
 728 |       
 729 |         
 730 |           <a href="https://github.com/JIAOBANTANG"
 731 |             class="social fab fa-github flat-btn"
 732 |             target="_blank"
 733 |             rel="external nofollow noopener noreferrer">
 734 |           </a>
 735 |         
 736 |       
 737 |         
 738 |           <a href="https://codepen.io/jiaobantang/pens/public/"
 739 |             class="social fab fa-codepen flat-btn"
 740 |             target="_blank"
 741 |             rel="external nofollow noopener noreferrer">
 742 |           </a>
 743 |         
 744 |       
 745 |         
 746 |           <a href="https://music.163.com/#/user/home?id=65219633"
 747 |             class="social fas fa-headphones-alt flat-btn"
 748 |             target="_blank"
 749 |             rel="external nofollow noopener noreferrer">
 750 |           </a>
 751 |         
 752 |       
 753 |     </div>
 754 |   
 755 |   <br>
 756 |   <div>
 757 |     <div class="footer">
 758 |       <p><span style="color:rgb(61, 197, 80);">种一棵树最好的时间是十年前，其次是现在</span></p>
 759 | 
 760 |     </div>
 761 | 
 762 |   </div>
 763 |   <!-- <div><p>Blog content follows the <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/deed.en" target="_blank" rel="noopener">Attribution-NonCommercial-ShareAlike 4.0 International (CC BY-NC-SA 4.0) License</a></p>
 764 | </div> -->
 765 |   <div>
 766 |     本站使用
 767 |     <a href="https://xaoxuu.com/wiki/material-x/" target="_blank" class="codename">Material X</a>
 768 |     作为主题
 769 |     
 770 |       ，
 771 |       总访问量为
 772 |       <span id="busuanzi_value_site_pv"><i class="fas fa-spinner fa-spin fa-fw" aria-hidden="true"></i></span>
 773 |       次
 774 |     
 775 |     。
 776 |   </div>
 777 |   <div id="sitetime"></div>
 778 | </footer>
 779 | <script>setLoadingBarProgress(80);</script>
 780 | <script src="https://cdn.bootcss.com/jquery/3.3.0/jquery.min.js"></script>
 781 | <!-- 血小板 -->
 782 | <div id="landlord">
 783 |   <div class="message" style="opacity:0"></div>
 784 |   <canvas id="live2d" width="560" height="500" class="live2d"></canvas>
 785 |   <div class="hide-button">隐藏</div>
 786 | </div>
 787 | <!-- 血小板-->
 788 | <script type="text/javascript">
 789 |   var message_Path = '/live2d/'
 790 | </script>
 791 | <script type="text/javascript" src="/live2d/js/live2d.js"></script>
 792 | <script type="text/javascript" src="/live2d/js/message.js"></script>
 793 | <script type="text/javascript">
 794 |   loadlive2d("live2d", "/live2d/model/xiaoban/model.json");
 795 | </script>
 796 | <!-- 点击特效，输入特效 运行时间 -->
 797 | <script type="text/javascript" src="/cool/cooltext.js"></script>
 798 | <script type="text/javascript" src="/cool/clicklove.js"></script>
 799 | <script type="text/javascript" src="/cool/sitetime.js"></script>
 800 | <script type="text/javascript" src="/cool/banner.js"></script>
 801 | 
 802 | 
 803 |       <script>setLoadingBarProgress(60);</script>
 804 |     </div>
 805 |     <a class="s-top fas fa-arrow-up fa-fw" href='javascript:void(0)' target="_blank" rel="noopener"></a>
 806 |   </div>
 807 |   <script src="https://cdn.jsdelivr.net/npm/jquery@3.3.1/dist/jquery.min.js"></script>
 808 | 
 809 |   <script>
 810 |     var GOOGLE_CUSTOM_SEARCH_API_KEY = "";
 811 |     var GOOGLE_CUSTOM_SEARCH_ENGINE_ID = "";
 812 |     var ALGOLIA_API_KEY = "";
 813 |     var ALGOLIA_APP_ID = "";
 814 |     var ALGOLIA_INDEX_NAME = "";
 815 |     var AZURE_SERVICE_NAME = "";
 816 |     var AZURE_INDEX_NAME = "";
 817 |     var AZURE_QUERY_KEY = "";
 818 |     var BAIDU_API_ID = "";
 819 |     var SEARCH_SERVICE = "hexo" || "hexo";
 820 |     var ROOT = "/"||"/";
 821 |     if(!ROOT.endsWith('/'))ROOT += '/';
 822 |   </script>
 823 | 
 824 | <script src="//instant.page/1.2.2" type="module" integrity="sha384-2xV8M5griQmzyiY3CDqh1dn4z3llDVqZDqzjzcY+jCBCk/a5fXJmuZ/40JJAPeoU"></script>
 825 | 
 826 | 
 827 |   <script async src="https://cdn.jsdelivr.net/npm/scrollreveal@4.0.5/dist/scrollreveal.min.js"></script>
 828 |   <script type="text/javascript">
 829 |     $(function() {
 830 |       const $reveal = $('.reveal');
 831 |       if ($reveal.length === 0) return;
 832 |       const sr = ScrollReveal({ distance: 0 });
 833 |       sr.reveal('.reveal');
 834 |     });
 835 |   </script>
 836 | 
 837 | 
 838 |   <script src="https://cdn.jsdelivr.net/npm/node-waves@0.7.6/dist/waves.min.js"></script>
 839 |   <script type="text/javascript">
 840 |     $(function() {
 841 |       Waves.attach('.flat-btn', ['waves-button']);
 842 |       Waves.attach('.float-btn', ['waves-button', 'waves-float']);
 843 |       Waves.attach('.float-btn-light', ['waves-button', 'waves-float', 'waves-light']);
 844 |       Waves.attach('.flat-box', ['waves-block']);
 845 |       Waves.attach('.float-box', ['waves-block', 'waves-float']);
 846 |       Waves.attach('.waves-image');
 847 |       Waves.init();
 848 |     });
 849 |   </script>
 850 | 
 851 | 
 852 |   <script async src="https://cdn.jsdelivr.net/gh/xaoxuu/cdn-busuanzi@2.3/js/busuanzi.pure.mini.js"></script>
 853 | 
 854 | 
 855 | 
 856 | 
 857 |   
 858 |   
 859 |   
 860 |     <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-backstretch/2.0.4/jquery.backstretch.min.js"></script>
 861 |     <script type="text/javascript">
 862 |       $(function(){
 863 |         if ('.cover') {
 864 |           $('.cover').backstretch(
 865 |           ["https://img.vim-cn.com/29/91197b04c13f512f734a76d4ac422d89dbe229.jpg"],
 866 |           {
 867 |             duration: "6000",
 868 |             fade: "2500"
 869 |           });
 870 |         } else {
 871 |           $.backstretch(
 872 |           ["https://img.vim-cn.com/29/91197b04c13f512f734a76d4ac422d89dbe229.jpg"],
 873 |           {
 874 |             duration: "6000",
 875 |             fade: "2500"
 876 |           });
 877 |         }
 878 |       });
 879 |     </script>
 880 |   
 881 | 
 882 | 
 883 | 
 884 | 
 885 | 
 886 | 
 887 | 
 888 | 
 889 | 
 890 | 
 891 | 
 892 |   <script src="https://cdn.jsdelivr.net/gh/xaoxuu/cdn-material-x@19.9/js/app.js"></script>
 893 | 
 894 | 
 895 |   <script src="https://cdn.jsdelivr.net/gh/xaoxuu/cdn-material-x@19.9/js/search.js"></script>
 896 | 
 897 | 
 898 | 
 899 | 
 900 | <!-- 复制 -->
 901 | <script src="https://cdn.jsdelivr.net/npm/clipboard@2/dist/clipboard.min.js"></script>
 902 | <script>
 903 |   let COPY_SUCCESS = "复制成功";
 904 |   let COPY_FAILURE = "复制失败";
 905 |   /*页面载入完成后，创建复制按钮*/
 906 |   !function (e, t, a) {
 907 |     /* code */
 908 |     var initCopyCode = function(){
 909 |       var copyHtml = '';
 910 |       copyHtml += '<button class="btn-copy" data-clipboard-snippet="">';
 911 |       copyHtml += '  <i class="fa fa-copy"></i><span>复制</span>';
 912 |       copyHtml += '</button>';
 913 |       $(".highlight .code pre").before(copyHtml);
 914 |       var clipboard = new ClipboardJS('.btn-copy', {
 915 |         target: function(trigger) {
 916 |           return trigger.nextElementSibling;
 917 |         }
 918 |       });
 919 | 
 920 |       clipboard.on('success', function(e) {
 921 |         //您可以加入成功提示
 922 |         console.info('Action:', e.action);
 923 |         console.info('Text:', e.text);
 924 |         console.info('Trigger:', e.trigger);
 925 |         success_prompt(COPY_SUCCESS);
 926 |         e.clearSelection();
 927 |       });
 928 |       clipboard.on('error', function(e) {
 929 |         //您可以加入失败提示
 930 |         console.error('Action:', e.action);
 931 |         console.error('Trigger:', e.trigger);
 932 |         fail_prompt(COPY_FAILURE);
 933 |       });
 934 |     }
 935 |     initCopyCode();
 936 | 
 937 |   }(window, document);
 938 | 
 939 |   /**
 940 |    * 弹出式提示框，默认1.5秒自动消失
 941 |    * @param message 提示信息
 942 |    * @param style 提示样式，有alert-success、alert-danger、alert-warning、alert-info
 943 |    * @param time 消失时间
 944 |    */
 945 |   var prompt = function (message, style, time)
 946 |   {
 947 |       style = (style === undefined) ? 'alert-success' : style;
 948 |       time = (time === undefined) ? 1500 : time*1000;
 949 |       $('<div>')
 950 |           .appendTo('body')
 951 |           .addClass('alert ' + style)
 952 |           .html(message)
 953 |           .show()
 954 |           .delay(time)
 955 |           .fadeOut();
 956 |   };
 957 | 
 958 |   // 成功提示
 959 |   var success_prompt = function(message, time)
 960 |   {
 961 |       prompt(message, 'alert-success', time);
 962 |   };
 963 | 
 964 |   // 失败提示
 965 |   var fail_prompt = function(message, time)
 966 |   {
 967 |       prompt(message, 'alert-danger', time);
 968 |   };
 969 | 
 970 |   // 提醒
 971 |   var warning_prompt = function(message, time)
 972 |   {
 973 |       prompt(message, 'alert-warning', time);
 974 |   };
 975 | 
 976 |   // 信息提示
 977 |   var info_prompt = function(message, time)
 978 |   {
 979 |       prompt(message, 'alert-info', time);
 980 |   };
 981 | 
 982 | </script>
 983 | 
 984 | 
 985 | <!-- fancybox -->
 986 | <script src="https://cdn.jsdelivr.net/gh/fancyapps/fancybox@3.5.7/dist/jquery.fancybox.min.js"></script>
 987 | <script>
 988 |   let LAZY_LOAD_IMAGE = "";
 989 |   $(".article-entry").find("fancybox").find("img").each(function () {
 990 |       var element = document.createElement("a");
 991 |       $(element).attr("data-fancybox", "gallery");
 992 |       $(element).attr("href", $(this).attr("src"));
 993 |       /* 图片采用懒加载处理时,
 994 |        * 一般图片标签内会有个属性名来存放图片的真实地址，比如 data-original,
 995 |        * 那么此处将原本的属性名src替换为对应属性名data-original,
 996 |        * 修改如下
 997 |        */
 998 |        if (LAZY_LOAD_IMAGE) {
 999 |          $(element).attr("href", $(this).attr("data-original"));
1000 |        }
1001 |       $(this).wrap(element);
1002 |   });
1003 | </script>
1004 | 
1005 | 
1006 | 
1007 | 
1008 | 
1009 |   <script>setLoadingBarProgress(100);</script>
1010 | </body>
1011 | </html>
1012 | 


--------------------------------------------------------------------------------
/tags/设计模式/index.html:
--------------------------------------------------------------------------------
   1 | <!DOCTYPE html>
   2 | <html>
   3 | <head>
   4 |   <meta charset="utf-8">
   5 |   <meta http-equiv="X-UA-Compatible" content="IE=edge" />
   6 |   
   7 |   <title>Tag: 设计模式 | 搅拌糖</title>
   8 |   
   9 |   <meta name="keywords" content="搅拌糖,搅拌糖°,搅拌糖的个人博客">
  10 |   
  11 |   
  12 |   <meta name="description" content="种一棵树最好的时间是十年前，其次是现在">
  13 |   
  14 | 
  15 |   
  16 |   <link rel="shortcut icon" type="image/ico" href="/favicon.ico"/>
  17 |   <meta name="HandheldFriendly" content="True" />
  18 |   <meta name="apple-mobile-web-app-capable" content="yes">
  19 |   <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  20 |   <!-- meta -->
  21 |   
  22 | 
  23 |   <!-- link -->
  24 |   <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/fancyapps/fancybox@3.5.7/dist/jquery.fancybox.min.css" />
  25 |   
  26 |   <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/node-waves@0.7.6/dist/waves.min.css">
  27 |   
  28 |   <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@5.10.1/css/all.min.css">
  29 |   
  30 | 
  31 |   
  32 | 
  33 |   
  34 |     <link rel="stylesheet" href="/style.css">
  35 |   
  36 | 
  37 |   <script>
  38 |     function setLoadingBarProgress(num) {
  39 |       document.getElementById('loading-bar').style.width=num+"%";
  40 |     }
  41 |   </script>
  42 | 
  43 |   
  44 |   
  45 |   <!-- 血小板-->
  46 | <link rel="stylesheet" href="/live2d/css/live2d.css" />
  47 | </head>
  48 | 
  49 | <body>
  50 |   
  51 |   
  52 |   <div class="cover-wrapper">
  53 |     <cover class='cover  half'>
  54 |       
  55 |         
  56 |   <img class='logo shake' src='http://cdn.treelo.xin/avatar.png'/>
  57 | 
  58 | 
  59 |   <div class="m_search">
  60 |     <form name="searchform" class="form u-search-form">
  61 |       <input type="text" class="input u-search-input" placeholder="" />
  62 |       <i class="icon fas fa-search fa-fw"></i>
  63 |     </form>
  64 |   </div>
  65 | 
  66 | <div class='menu navgation'>
  67 |   <ul class='h-list'>
  68 |     
  69 |       
  70 |         <li>
  71 |           <a class="nav home" href="/"
  72 |             
  73 |             
  74 |             id="home">
  75 |             <i class='fas fa-rss fa-fw'></i>&nbsp;博文
  76 |           </a>
  77 |         </li>
  78 |       
  79 |         <li>
  80 |           <a class="nav home" href="/projects/"
  81 |             
  82 |             
  83 |             id="projects">
  84 |             <i class='fas fa-code-branch fa-fw'></i>&nbsp;项目
  85 |           </a>
  86 |         </li>
  87 |       
  88 |         <li>
  89 |           <a class="nav home" href="/friends/"
  90 |             
  91 |               rel="nofollow"
  92 |             
  93 |             
  94 |             id="friends">
  95 |             <i class='fas fa-link fa-fw'></i>&nbsp;友链
  96 |           </a>
  97 |         </li>
  98 |       
  99 |         <li>
 100 |           <a class="nav home" href="/about/"
 101 |             
 102 |               rel="nofollow"
 103 |             
 104 |             
 105 |             id="about">
 106 |             <i class='fas fa-info-circle fa-fw'></i>&nbsp;关于
 107 |           </a>
 108 |         </li>
 109 |       
 110 |     
 111 |   </ul>
 112 | </div>
 113 | 
 114 |       
 115 |     </cover>
 116 |     <header class="l_header pure">
 117 |   <div id="loading-bar-wrapper">
 118 |     <div id="loading-bar" class="pure"></div>
 119 |   </div>
 120 | 
 121 | 	<div class='wrapper'>
 122 | 		<div class="nav-main container container--flex">
 123 |       <a class="logo flat-box" href='/' >
 124 |         
 125 |           搅拌糖
 126 |         
 127 |       </a>
 128 | 			<div class='menu navgation'>
 129 | 				<ul class='h-list'>
 130 |           
 131 |   					
 132 |   						<li>
 133 | 								<a class="nav flat-box" href="/"
 134 |                   
 135 |                   
 136 |                   id="home">
 137 | 									<i class='fas fa-shapes fa-fw'></i>&nbsp;博客
 138 | 								</a>
 139 | 							</li>
 140 |       			
 141 |   						<li>
 142 | 								<a class="nav flat-box" href="/categories/"
 143 |                   
 144 |                     rel="nofollow"
 145 |                   
 146 |                   
 147 |                   id="categories">
 148 | 									<i class='fas fa-calendar-alt fa-fw'></i>&nbsp;归档
 149 | 								</a>
 150 | 							</li>
 151 |       			
 152 |   						<li>
 153 | 								<a class="nav flat-box" href="/2018/11/11/message/"
 154 |                   
 155 |                     rel="nofollow"
 156 |                   
 157 |                   
 158 |                   id="20181111message">
 159 | 									<i class='fas fa-comment-alt fa-fw'></i>&nbsp;留言
 160 | 								</a>
 161 | 							</li>
 162 |       			
 163 |       		
 164 | 				</ul>
 165 | 			</div>
 166 | 
 167 | 			
 168 | 				<div class="m_search">
 169 | 					<form name="searchform" class="form u-search-form">
 170 | 						<input type="text" class="input u-search-input" placeholder="搜索" />
 171 | 						<i class="icon fas fa-search fa-fw"></i>
 172 | 					</form>
 173 | 				</div>
 174 | 			
 175 | 			<ul class='switcher h-list'>
 176 | 				
 177 | 					<li class='s-search'><a class="fas fa-search fa-fw" href='javascript:void(0)' target="_blank" rel="noopener"></a></li>
 178 | 				
 179 | 				<li class='s-menu'><a class="fas fa-bars fa-fw" href='javascript:void(0)' target="_blank" rel="noopener"></a></li>
 180 | 			</ul>
 181 | 		</div>
 182 | 
 183 | 		<div class='nav-sub container container--flex'>
 184 | 			<a class="logo flat-box"></a>
 185 | 			<ul class='switcher h-list'>
 186 | 				<li class='s-comment'><a class="flat-btn fas fa-comments fa-fw" href='javascript:void(0)' target="_blank" rel="noopener"></a></li>
 187 |         
 188 |           <li class='s-toc'><a class="flat-btn fas fa-list fa-fw" href='javascript:void(0)' target="_blank" rel="noopener"></a></li>
 189 |         
 190 | 			</ul>
 191 | 		</div>
 192 | 	</div>
 193 | </header>
 194 | 	<aside class="menu-phone">
 195 |     <header>
 196 | 		<nav class="menu navgation">
 197 |       <ul>
 198 |         
 199 |           
 200 |             <li>
 201 | 							<a class="nav flat-box" href="/"
 202 |                 
 203 |                 
 204 |                 id="home">
 205 | 								<i class='fas fa-shapes fa-fw'></i>&nbsp;博客
 206 | 							</a>
 207 |             </li>
 208 |           
 209 |             <li>
 210 | 							<a class="nav flat-box" href="/categories/"
 211 |                 
 212 |                   rel="nofollow"
 213 |                 
 214 |                 
 215 |                 id="categories">
 216 | 								<i class='fas fa-calendar-alt fa-fw'></i>&nbsp;归档
 217 | 							</a>
 218 |             </li>
 219 |           
 220 |             <li>
 221 | 							<a class="nav flat-box" href="/2018/11/11/message/"
 222 |                 
 223 |                   rel="nofollow"
 224 |                 
 225 |                 
 226 |                 id="20181111message">
 227 | 								<i class='fas fa-comment-alt fa-fw'></i>&nbsp;留言
 228 | 							</a>
 229 |             </li>
 230 |           
 231 |        
 232 |       </ul>
 233 | 		</nav>
 234 |     </header>
 235 | 	</aside>
 236 | <script>setLoadingBarProgress(40);</script>
 237 | 
 238 |   </div>
 239 | 
 240 | 
 241 |   <div class="l_body">
 242 |     <div class='body-wrapper'>
 243 |       
 244 | <div class='l_main'>
 245 |   
 246 |     
 247 |       
 248 |   <section class="post-list">
 249 |     
 250 |       
 251 |         
 252 |           
 253 |         
 254 |       
 255 |     
 256 |     
 257 |       
 258 |         
 259 |           <div class='post-wrapper'>
 260 |             <article class="post reveal banner ">
 261 |   
 262 | 
 263 | 
 264 |   <section class='meta'>
 265 |     
 266 |     
 267 |     <div class="meta" id="header-meta">
 268 |       
 269 |         
 270 |   <h2 class="title">
 271 |     <a href="/2020/01/03/design-singleton/">
 272 |       设计模式-创建型-单例模式(Singleton)
 273 |     </a>
 274 |   </h2>
 275 | 
 276 | 
 277 |       
 278 |       <div class='new-meta-box'>
 279 |         
 280 |           
 281 |         
 282 |           
 283 |             
 284 |   <div class='new-meta-item author'>
 285 |     
 286 |       <a href="https://jiaobantang.github.io" rel="nofollow">
 287 |         
 288 |           <i class="fas fa-user" aria-hidden="true"></i>
 289 |         
 290 |         <p>搅拌糖</p>
 291 |       </a>
 292 |     
 293 |   </div>
 294 | 
 295 | 
 296 |           
 297 |         
 298 |           
 299 |             <div class="new-meta-item date">
 300 |   <a class='notlink'>
 301 |     <i class="fas fa-calendar-alt" aria-hidden="true"></i>
 302 |     <p>2020-01-03</p>
 303 |   </a>
 304 | </div>
 305 | 
 306 |           
 307 |         
 308 |           
 309 |             
 310 |   
 311 |   <div class='new-meta-item category'>
 312 |     <a href='/categories/Coding/Design/' rel="nofollow">
 313 |       <i class="fas fa-folder-open" aria-hidden="true"></i>
 314 |       <p>Coding&nbsp;/&nbsp;Design</p>
 315 |     </a>
 316 |   </div>
 317 | 
 318 | 
 319 |           
 320 |         
 321 |           
 322 |             
 323 | 
 324 |           
 325 |         
 326 |       </div>
 327 |       
 328 |         <hr>
 329 |       
 330 |     </div>
 331 |   </section>
 332 | 
 333 | 
 334 |   <section class="article typo ">
 335 |     <div class="article-entry" itemprop="articleBody">
 336 |       <p>单例模式：使一个类只允许有一个对象的模式</p>
 337 |       
 338 |         <div class="readmore">
 339 |           <a href="/2020/01/03/design-singleton/" class="flat-box">
 340 |             <i class="fas fa-book-open fa-fw" aria-hidden="true"></i>
 341 |             阅读全文
 342 |           </a>
 343 |         </div>
 344 |       
 345 |     </div>
 346 |     
 347 |       <div class="full-width auto-padding tags">
 348 |         
 349 |           <a href="/tags/%E8%AE%BE%E8%AE%A1%E6%A8%A1%E5%BC%8F/" rel="nofollow"><i class="fas fa-tag fa-fw"></i> 设计模式</a>
 350 |         
 351 |       </div>
 352 |     
 353 |   </section>
 354 | </article>
 355 | 
 356 |           </div>
 357 |         
 358 |       
 359 |     
 360 |   </section>
 361 |   
 362 |     
 363 |     <!-- 根据主题中的设置决定是否在archive中针对摘要部分的MathJax公式加载mathjax.js文件 -->
 364 |     
 365 |     
 366 | 
 367 |   
 368 | 
 369 | 
 370 |     
 371 |   
 372 | </div>
 373 | <aside class='l_side'>
 374 |   
 375 |     
 376 |     
 377 |       
 378 |       
 379 |         
 380 |           
 381 |           
 382 |             
 383 |               <section class='widget shake author'>
 384 |   <div class='content pure'>
 385 |     
 386 |       <div class='avatar'>
 387 |         <img class='avatar' src='http://cdn.treelo.xin/avatar.png'/>
 388 |       </div>
 389 |     
 390 |     
 391 |     
 392 |       <div class="social-wrapper">
 393 |         
 394 |           
 395 |             <a href="/mailto:847280718@qq.com"
 396 |               class="social fas fa-envelope flat-btn"
 397 |               target="_blank"
 398 |               rel="external nofollow noopener noreferrer">
 399 |             </a>
 400 |           
 401 |         
 402 |           
 403 |             <a href="https://github.com/JIAOBANTANG"
 404 |               class="social fab fa-github flat-btn"
 405 |               target="_blank"
 406 |               rel="external nofollow noopener noreferrer">
 407 |             </a>
 408 |           
 409 |         
 410 |           
 411 |             <a href="https://codepen.io/jiaobantang/pens/public/"
 412 |               class="social fab fa-codepen flat-btn"
 413 |               target="_blank"
 414 |               rel="external nofollow noopener noreferrer">
 415 |             </a>
 416 |           
 417 |         
 418 |           
 419 |             <a href="https://music.163.com/#/user/home?id=65219633"
 420 |               class="social fas fa-headphones-alt flat-btn"
 421 |               target="_blank"
 422 |               rel="external nofollow noopener noreferrer">
 423 |             </a>
 424 |           
 425 |         
 426 |       </div>
 427 |     
 428 |   </div>
 429 | </section>
 430 | 
 431 |             
 432 |           
 433 |         
 434 |           
 435 |           
 436 |         
 437 |           
 438 |           
 439 |         
 440 |           
 441 |           
 442 |         
 443 |           
 444 |           
 445 |         
 446 |           
 447 |           
 448 |         
 449 |       
 450 |         
 451 |           
 452 |           
 453 |         
 454 |           
 455 |           
 456 |         
 457 |           
 458 |           
 459 |         
 460 |           
 461 |           
 462 |         
 463 |           
 464 |           
 465 |         
 466 |           
 467 |           
 468 |             
 469 |               <section class='widget list'>
 470 |   
 471 | <header class='pure'>
 472 |   <div><i class="fas fa-thumbs-up fa-fw" aria-hidden="true"></i>&nbsp;&nbsp;强烈推荐</div>
 473 |   
 474 | </header>
 475 | 
 476 |   <div class='content pure'>
 477 |     <ul class="entry">
 478 |       
 479 |         <li><a class="flat-box" title="/2019/06/09/photo-map/" href="/2019/06/09/photo-map/"
 480 |           
 481 |           
 482 |           >
 483 |           <div class='name'>
 484 |             
 485 |               <i class=" fa-fw" aria-hidden="true"></i>
 486 |             
 487 |             &nbsp;&nbsp;地图相册
 488 |           </div>
 489 |           
 490 |         </a></li>
 491 |       
 492 |     </ul>
 493 |   </div>
 494 | </section>
 495 | 
 496 |             
 497 |           
 498 |         
 499 |       
 500 |         
 501 |           
 502 |           
 503 |         
 504 |           
 505 |           
 506 |         
 507 |           
 508 |           
 509 |             
 510 |               <section class='widget grid'>
 511 |   
 512 | <header class='pure'>
 513 |   <div><i class="fas fa-map-signs fa-fw" aria-hidden="true"></i>&nbsp;&nbsp;站内导航</div>
 514 |   
 515 | </header>
 516 | 
 517 |   <div class='content pure'>
 518 |     <ul class="grid navgation">
 519 |       
 520 |         <li><a class="flat-box" title="/" href="/"
 521 |           
 522 |           
 523 |           id="home">
 524 |           
 525 |             <i class="fas fa-clock fa-fw" aria-hidden="true"></i>
 526 |           
 527 |           近期文章
 528 |         </a></li>
 529 |       
 530 |         <li><a class="flat-box" title="/archives/" href="/archives/"
 531 |           
 532 |             rel="nofollow"
 533 |           
 534 |           
 535 |           id="archives">
 536 |           
 537 |             <i class="fas fa-archive fa-fw" aria-hidden="true"></i>
 538 |           
 539 |           文章归档
 540 |         </a></li>
 541 |       
 542 |         <li><a class="flat-box" title="/projects/" href="/projects/"
 543 |           
 544 |           
 545 |           id="projects">
 546 |           
 547 |             <i class="fas fa-code-branch fa-fw" aria-hidden="true"></i>
 548 |           
 549 |           开源项目
 550 |         </a></li>
 551 |       
 552 |         <li><a class="flat-box" title="/friends/" href="/friends/"
 553 |           
 554 |             rel="nofollow"
 555 |           
 556 |           
 557 |           id="friends">
 558 |           
 559 |             <i class="fas fa-link fa-fw" aria-hidden="true"></i>
 560 |           
 561 |           我的友链
 562 |         </a></li>
 563 |       
 564 |         <li><a class="flat-box" title="/about/" href="/about/"
 565 |           
 566 |             rel="nofollow"
 567 |           
 568 |           
 569 |           id="about">
 570 |           
 571 |             <i class="fas fa-info-circle fa-fw" aria-hidden="true"></i>
 572 |           
 573 |           关于小站
 574 |         </a></li>
 575 |       
 576 |     </ul>
 577 |   </div>
 578 | </section>
 579 | 
 580 |             
 581 |           
 582 |         
 583 |           
 584 |           
 585 |         
 586 |           
 587 |           
 588 |         
 589 |           
 590 |           
 591 |         
 592 |       
 593 |         
 594 |           
 595 |           
 596 |         
 597 |           
 598 |           
 599 |         
 600 |           
 601 |           
 602 |         
 603 |           
 604 |           
 605 |             
 606 |               
 607 |   <section class='widget category'>
 608 |     
 609 | <header class='pure'>
 610 |   <div><i class="fas fa-folder-open fa-fw" aria-hidden="true"></i>&nbsp;&nbsp;文章分类</div>
 611 |   
 612 |     <a class="rightBtn"
 613 |     
 614 |       rel="nofollow"
 615 |     
 616 |     
 617 |     href="/blog/categories/"
 618 |     title="blog/categories/">
 619 |     <i class="fas fa-expand-arrows-alt fa-fw"></i></a>
 620 |   
 621 | </header>
 622 | 
 623 |     <div class='content pure'>
 624 |       <ul class="entry">
 625 |         
 626 |           <li><a class="flat-box" title="/categories/Coding/" href="/categories/Coding/"><div class='name'>Coding</div><div class='badge'>(19)</div></a></li>
 627 |         
 628 |           <li><a class="flat-box child" title="/categories/Coding/Design/" href="/categories/Coding/Design/"><div class='name'>Design</div><div class='badge'>(1)</div></a></li>
 629 |         
 630 |           <li><a class="flat-box child" title="/categories/Coding/Docker/" href="/categories/Coding/Docker/"><div class='name'>Docker</div><div class='badge'>(5)</div></a></li>
 631 |         
 632 |           <li><a class="flat-box child" title="/categories/Coding/JS/" href="/categories/Coding/JS/"><div class='name'>JS</div><div class='badge'>(1)</div></a></li>
 633 |         
 634 |           <li><a class="flat-box child" title="/categories/Coding/MySQL/" href="/categories/Coding/MySQL/"><div class='name'>MySQL</div><div class='badge'>(3)</div></a></li>
 635 |         
 636 |           <li><a class="flat-box child" title="/categories/Coding/PHP/" href="/categories/Coding/PHP/"><div class='name'>PHP</div><div class='badge'>(2)</div></a></li>
 637 |         
 638 |           <li><a class="flat-box child" title="/categories/Coding/PSR/" href="/categories/Coding/PSR/"><div class='name'>PSR</div><div class='badge'>(1)</div></a></li>
 639 |         
 640 |           <li><a class="flat-box child" title="/categories/Coding/Swoole/" href="/categories/Coding/Swoole/"><div class='name'>Swoole</div><div class='badge'>(1)</div></a></li>
 641 |         
 642 |           <li><a class="flat-box child" title="/categories/Coding/Web/" href="/categories/Coding/Web/"><div class='name'>Web</div><div class='badge'>(3)</div></a></li>
 643 |         
 644 |           <li><a class="flat-box" title="/categories/PHP/" href="/categories/PHP/"><div class='name'>PHP</div><div class='badge'>(1)</div></a></li>
 645 |         
 646 |           <li><a class="flat-box" title="/categories/Self/" href="/categories/Self/"><div class='name'>Self</div><div class='badge'>(1)</div></a></li>
 647 |         
 648 |           <li><a class="flat-box" title="/categories/%E8%A1%80%E5%B0%8F%E6%9D%BF/" href="/categories/%E8%A1%80%E5%B0%8F%E6%9D%BF/"><div class='name'>血小板</div><div class='badge'>(1)</div></a></li>
 649 |         
 650 |       </ul>
 651 |     </div>
 652 |   </section>
 653 | 
 654 | 
 655 |             
 656 |           
 657 |         
 658 |           
 659 |           
 660 |         
 661 |           
 662 |           
 663 |         
 664 |       
 665 |         
 666 |           
 667 |           
 668 |         
 669 |           
 670 |           
 671 |         
 672 |           
 673 |           
 674 |         
 675 |           
 676 |           
 677 |         
 678 |           
 679 |           
 680 |             
 681 |               
 682 |   <section class='widget tagcloud'>
 683 |     
 684 | <header class='pure'>
 685 |   <div><i class="fas fa-tags fa-fw" aria-hidden="true"></i>&nbsp;&nbsp;热门标签</div>
 686 |   
 687 |     <a class="rightBtn"
 688 |     
 689 |       rel="nofollow"
 690 |     
 691 |     
 692 |     href="/blog/tags/"
 693 |     title="blog/tags/">
 694 |     <i class="fas fa-expand-arrows-alt fa-fw"></i></a>
 695 |   
 696 | </header>
 697 | 
 698 |     <div class='content pure'>
 699 |       <a href="/tags/Coding/" style="font-size: 20.67px; color: #6c6c6c">Coding</a> <a href="/tags/Cool/" style="font-size: 14px; color: #999">Cool</a> <a href="/tags/JavaScript/" style="font-size: 14px; color: #999">JavaScript</a> <a href="/tags/MySQL/" style="font-size: 17.33px; color: #828282">MySQL</a> <a href="/tags/OOP/" style="font-size: 14px; color: #999">OOP</a> <a href="/tags/PDO/" style="font-size: 14px; color: #999">PDO</a> <a href="/tags/PHP/" style="font-size: 14px; color: #999">PHP</a> <a href="/tags/Swoole/" style="font-size: 14px; color: #999">Swoole</a> <a href="/tags/docker/" style="font-size: 24px; color: #555">docker</a> <a href="/tags/live2D/" style="font-size: 14px; color: #999">live2D</a> <a href="/tags/nginx/" style="font-size: 14px; color: #999">nginx</a> <a href="/tags/php/" style="font-size: 14px; color: #999">php</a> <a href="/tags/snowflake/" style="font-size: 14px; color: #999">snowflake</a> <a href="/tags/%E5%9C%B0%E5%9B%BE%E7%9B%B8%E5%86%8C/" style="font-size: 14px; color: #999">地图相册</a> <a href="/tags/%E6%8E%A5%E5%8F%A3%E5%BC%80%E5%8F%91/" style="font-size: 14px; color: #999">接口开发</a> <a href="/tags/%E6%94%B9%E5%8F%98/" style="font-size: 14px; color: #999">改变</a> <a href="/tags/%E6%97%A5%E7%AD%BE/" style="font-size: 14px; color: #999">日签</a> <a href="/tags/%E6%9C%8D%E5%8A%A1%E7%AB%AF/" style="font-size: 14px; color: #999">服务端</a> <a href="/tags/%E7%B3%96%E7%B3%96%E6%97%A5%E7%AD%BE/" style="font-size: 14px; color: #999">糖糖日签</a> <a href="/tags/%E8%87%AA%E6%88%91%E5%8F%91%E5%B1%95/" style="font-size: 14px; color: #999">自我发展</a> <a href="/tags/%E8%A1%80%E5%B0%8F%E6%9D%BF/" style="font-size: 14px; color: #999">血小板</a> <a href="/tags/%E8%AE%BE%E8%AE%A1%E6%A8%A1%E5%BC%8F/" style="font-size: 14px; color: #999">设计模式</a>
 700 |     </div>
 701 |   </section>
 702 | 
 703 | 
 704 |             
 705 |           
 706 |         
 707 |           
 708 |           
 709 |         
 710 |       
 711 |     
 712 | 
 713 |   
 714 | </aside>
 715 | 
 716 | <footer id="footer" class="clearfix">
 717 |   
 718 |   
 719 |     <div class="social-wrapper">
 720 |       
 721 |         
 722 |           <a href="/mailto:847280718@qq.com"
 723 |             class="social fas fa-envelope flat-btn"
 724 |             target="_blank"
 725 |             rel="external nofollow noopener noreferrer">
 726 |           </a>
 727 |         
 728 |       
 729 |         
 730 |           <a href="https://github.com/JIAOBANTANG"
 731 |             class="social fab fa-github flat-btn"
 732 |             target="_blank"
 733 |             rel="external nofollow noopener noreferrer">
 734 |           </a>
 735 |         
 736 |       
 737 |         
 738 |           <a href="https://codepen.io/jiaobantang/pens/public/"
 739 |             class="social fab fa-codepen flat-btn"
 740 |             target="_blank"
 741 |             rel="external nofollow noopener noreferrer">
 742 |           </a>
 743 |         
 744 |       
 745 |         
 746 |           <a href="https://music.163.com/#/user/home?id=65219633"
 747 |             class="social fas fa-headphones-alt flat-btn"
 748 |             target="_blank"
 749 |             rel="external nofollow noopener noreferrer">
 750 |           </a>
 751 |         
 752 |       
 753 |     </div>
 754 |   
 755 |   <br>
 756 |   <div>
 757 |     <div class="footer">
 758 |       <p><span style="color:rgb(61, 197, 80);">种一棵树最好的时间是十年前，其次是现在</span></p>
 759 | 
 760 |     </div>
 761 | 
 762 |   </div>
 763 |   <!-- <div><p>Blog content follows the <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/deed.en" target="_blank" rel="noopener">Attribution-NonCommercial-ShareAlike 4.0 International (CC BY-NC-SA 4.0) License</a></p>
 764 | </div> -->
 765 |   <div>
 766 |     本站使用
 767 |     <a href="https://xaoxuu.com/wiki/material-x/" target="_blank" class="codename">Material X</a>
 768 |     作为主题
 769 |     
 770 |       ，
 771 |       总访问量为
 772 |       <span id="busuanzi_value_site_pv"><i class="fas fa-spinner fa-spin fa-fw" aria-hidden="true"></i></span>
 773 |       次
 774 |     
 775 |     。
 776 |   </div>
 777 |   <div id="sitetime"></div>
 778 | </footer>
 779 | <script>setLoadingBarProgress(80);</script>
 780 | <script src="https://cdn.bootcss.com/jquery/3.3.0/jquery.min.js"></script>
 781 | <!-- 血小板 -->
 782 | <div id="landlord">
 783 |   <div class="message" style="opacity:0"></div>
 784 |   <canvas id="live2d" width="560" height="500" class="live2d"></canvas>
 785 |   <div class="hide-button">隐藏</div>
 786 | </div>
 787 | <!-- 血小板-->
 788 | <script type="text/javascript">
 789 |   var message_Path = '/live2d/'
 790 | </script>
 791 | <script type="text/javascript" src="/live2d/js/live2d.js"></script>
 792 | <script type="text/javascript" src="/live2d/js/message.js"></script>
 793 | <script type="text/javascript">
 794 |   loadlive2d("live2d", "/live2d/model/xiaoban/model.json");
 795 | </script>
 796 | <!-- 点击特效，输入特效 运行时间 -->
 797 | <script type="text/javascript" src="/cool/cooltext.js"></script>
 798 | <script type="text/javascript" src="/cool/clicklove.js"></script>
 799 | <script type="text/javascript" src="/cool/sitetime.js"></script>
 800 | <script type="text/javascript" src="/cool/banner.js"></script>
 801 | 
 802 | 
 803 |       <script>setLoadingBarProgress(60);</script>
 804 |     </div>
 805 |     <a class="s-top fas fa-arrow-up fa-fw" href='javascript:void(0)' target="_blank" rel="noopener"></a>
 806 |   </div>
 807 |   <script src="https://cdn.jsdelivr.net/npm/jquery@3.3.1/dist/jquery.min.js"></script>
 808 | 
 809 |   <script>
 810 |     var GOOGLE_CUSTOM_SEARCH_API_KEY = "";
 811 |     var GOOGLE_CUSTOM_SEARCH_ENGINE_ID = "";
 812 |     var ALGOLIA_API_KEY = "";
 813 |     var ALGOLIA_APP_ID = "";
 814 |     var ALGOLIA_INDEX_NAME = "";
 815 |     var AZURE_SERVICE_NAME = "";
 816 |     var AZURE_INDEX_NAME = "";
 817 |     var AZURE_QUERY_KEY = "";
 818 |     var BAIDU_API_ID = "";
 819 |     var SEARCH_SERVICE = "hexo" || "hexo";
 820 |     var ROOT = "/"||"/";
 821 |     if(!ROOT.endsWith('/'))ROOT += '/';
 822 |   </script>
 823 | 
 824 | <script src="//instant.page/1.2.2" type="module" integrity="sha384-2xV8M5griQmzyiY3CDqh1dn4z3llDVqZDqzjzcY+jCBCk/a5fXJmuZ/40JJAPeoU"></script>
 825 | 
 826 | 
 827 |   <script async src="https://cdn.jsdelivr.net/npm/scrollreveal@4.0.5/dist/scrollreveal.min.js"></script>
 828 |   <script type="text/javascript">
 829 |     $(function() {
 830 |       const $reveal = $('.reveal');
 831 |       if ($reveal.length === 0) return;
 832 |       const sr = ScrollReveal({ distance: 0 });
 833 |       sr.reveal('.reveal');
 834 |     });
 835 |   </script>
 836 | 
 837 | 
 838 |   <script src="https://cdn.jsdelivr.net/npm/node-waves@0.7.6/dist/waves.min.js"></script>
 839 |   <script type="text/javascript">
 840 |     $(function() {
 841 |       Waves.attach('.flat-btn', ['waves-button']);
 842 |       Waves.attach('.float-btn', ['waves-button', 'waves-float']);
 843 |       Waves.attach('.float-btn-light', ['waves-button', 'waves-float', 'waves-light']);
 844 |       Waves.attach('.flat-box', ['waves-block']);
 845 |       Waves.attach('.float-box', ['waves-block', 'waves-float']);
 846 |       Waves.attach('.waves-image');
 847 |       Waves.init();
 848 |     });
 849 |   </script>
 850 | 
 851 | 
 852 |   <script async src="https://cdn.jsdelivr.net/gh/xaoxuu/cdn-busuanzi@2.3/js/busuanzi.pure.mini.js"></script>
 853 | 
 854 | 
 855 | 
 856 | 
 857 |   
 858 |   
 859 |   
 860 |     <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-backstretch/2.0.4/jquery.backstretch.min.js"></script>
 861 |     <script type="text/javascript">
 862 |       $(function(){
 863 |         if ('.cover') {
 864 |           $('.cover').backstretch(
 865 |           ["https://img.vim-cn.com/29/91197b04c13f512f734a76d4ac422d89dbe229.jpg"],
 866 |           {
 867 |             duration: "6000",
 868 |             fade: "2500"
 869 |           });
 870 |         } else {
 871 |           $.backstretch(
 872 |           ["https://img.vim-cn.com/29/91197b04c13f512f734a76d4ac422d89dbe229.jpg"],
 873 |           {
 874 |             duration: "6000",
 875 |             fade: "2500"
 876 |           });
 877 |         }
 878 |       });
 879 |     </script>
 880 |   
 881 | 
 882 | 
 883 | 
 884 | 
 885 | 
 886 | 
 887 | 
 888 | 
 889 | 
 890 | 
 891 | 
 892 |   <script src="https://cdn.jsdelivr.net/gh/xaoxuu/cdn-material-x@19.9/js/app.js"></script>
 893 | 
 894 | 
 895 |   <script src="https://cdn.jsdelivr.net/gh/xaoxuu/cdn-material-x@19.9/js/search.js"></script>
 896 | 
 897 | 
 898 | 
 899 | 
 900 | <!-- 复制 -->
 901 | <script src="https://cdn.jsdelivr.net/npm/clipboard@2/dist/clipboard.min.js"></script>
 902 | <script>
 903 |   let COPY_SUCCESS = "复制成功";
 904 |   let COPY_FAILURE = "复制失败";
 905 |   /*页面载入完成后，创建复制按钮*/
 906 |   !function (e, t, a) {
 907 |     /* code */
 908 |     var initCopyCode = function(){
 909 |       var copyHtml = '';
 910 |       copyHtml += '<button class="btn-copy" data-clipboard-snippet="">';
 911 |       copyHtml += '  <i class="fa fa-copy"></i><span>复制</span>';
 912 |       copyHtml += '</button>';
 913 |       $(".highlight .code pre").before(copyHtml);
 914 |       var clipboard = new ClipboardJS('.btn-copy', {
 915 |         target: function(trigger) {
 916 |           return trigger.nextElementSibling;
 917 |         }
 918 |       });
 919 | 
 920 |       clipboard.on('success', function(e) {
 921 |         //您可以加入成功提示
 922 |         console.info('Action:', e.action);
 923 |         console.info('Text:', e.text);
 924 |         console.info('Trigger:', e.trigger);
 925 |         success_prompt(COPY_SUCCESS);
 926 |         e.clearSelection();
 927 |       });
 928 |       clipboard.on('error', function(e) {
 929 |         //您可以加入失败提示
 930 |         console.error('Action:', e.action);
 931 |         console.error('Trigger:', e.trigger);
 932 |         fail_prompt(COPY_FAILURE);
 933 |       });
 934 |     }
 935 |     initCopyCode();
 936 | 
 937 |   }(window, document);
 938 | 
 939 |   /**
 940 |    * 弹出式提示框，默认1.5秒自动消失
 941 |    * @param message 提示信息
 942 |    * @param style 提示样式，有alert-success、alert-danger、alert-warning、alert-info
 943 |    * @param time 消失时间
 944 |    */
 945 |   var prompt = function (message, style, time)
 946 |   {
 947 |       style = (style === undefined) ? 'alert-success' : style;
 948 |       time = (time === undefined) ? 1500 : time*1000;
 949 |       $('<div>')
 950 |           .appendTo('body')
 951 |           .addClass('alert ' + style)
 952 |           .html(message)
 953 |           .show()
 954 |           .delay(time)
 955 |           .fadeOut();
 956 |   };
 957 | 
 958 |   // 成功提示
 959 |   var success_prompt = function(message, time)
 960 |   {
 961 |       prompt(message, 'alert-success', time);
 962 |   };
 963 | 
 964 |   // 失败提示
 965 |   var fail_prompt = function(message, time)
 966 |   {
 967 |       prompt(message, 'alert-danger', time);
 968 |   };
 969 | 
 970 |   // 提醒
 971 |   var warning_prompt = function(message, time)
 972 |   {
 973 |       prompt(message, 'alert-warning', time);
 974 |   };
 975 | 
 976 |   // 信息提示
 977 |   var info_prompt = function(message, time)
 978 |   {
 979 |       prompt(message, 'alert-info', time);
 980 |   };
 981 | 
 982 | </script>
 983 | 
 984 | 
 985 | <!-- fancybox -->
 986 | <script src="https://cdn.jsdelivr.net/gh/fancyapps/fancybox@3.5.7/dist/jquery.fancybox.min.js"></script>
 987 | <script>
 988 |   let LAZY_LOAD_IMAGE = "";
 989 |   $(".article-entry").find("fancybox").find("img").each(function () {
 990 |       var element = document.createElement("a");
 991 |       $(element).attr("data-fancybox", "gallery");
 992 |       $(element).attr("href", $(this).attr("src"));
 993 |       /* 图片采用懒加载处理时,
 994 |        * 一般图片标签内会有个属性名来存放图片的真实地址，比如 data-original,
 995 |        * 那么此处将原本的属性名src替换为对应属性名data-original,
 996 |        * 修改如下
 997 |        */
 998 |        if (LAZY_LOAD_IMAGE) {
 999 |          $(element).attr("href", $(this).attr("data-original"));
1000 |        }
1001 |       $(this).wrap(element);
1002 |   });
1003 | </script>
1004 | 
1005 | 
1006 | 
1007 | 
1008 | 
1009 |   <script>setLoadingBarProgress(100);</script>
1010 | </body>
1011 | </html>
1012 | 


--------------------------------------------------------------------------------
/categories/Coding/Design/index.html:
--------------------------------------------------------------------------------
   1 | <!DOCTYPE html>
   2 | <html>
   3 | <head>
   4 |   <meta charset="utf-8">
   5 |   <meta http-equiv="X-UA-Compatible" content="IE=edge" />
   6 |   
   7 |   <title>Category: Design | 搅拌糖</title>
   8 |   
   9 |   <meta name="keywords" content="搅拌糖,搅拌糖°,搅拌糖的个人博客">
  10 |   
  11 |   
  12 |   <meta name="description" content="种一棵树最好的时间是十年前，其次是现在">
  13 |   
  14 | 
  15 |   
  16 |   <link rel="shortcut icon" type="image/ico" href="/favicon.ico"/>
  17 |   <meta name="HandheldFriendly" content="True" />
  18 |   <meta name="apple-mobile-web-app-capable" content="yes">
  19 |   <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  20 |   <!-- meta -->
  21 |   
  22 | 
  23 |   <!-- link -->
  24 |   <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/fancyapps/fancybox@3.5.7/dist/jquery.fancybox.min.css" />
  25 |   
  26 |   <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/node-waves@0.7.6/dist/waves.min.css">
  27 |   
  28 |   <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@5.10.1/css/all.min.css">
  29 |   
  30 | 
  31 |   
  32 | 
  33 |   
  34 |     <link rel="stylesheet" href="/style.css">
  35 |   
  36 | 
  37 |   <script>
  38 |     function setLoadingBarProgress(num) {
  39 |       document.getElementById('loading-bar').style.width=num+"%";
  40 |     }
  41 |   </script>
  42 | 
  43 |   
  44 |   
  45 |   <!-- 血小板-->
  46 | <link rel="stylesheet" href="/live2d/css/live2d.css" />
  47 | </head>
  48 | 
  49 | <body>
  50 |   
  51 |   
  52 |   <div class="cover-wrapper">
  53 |     <cover class='cover  half'>
  54 |       
  55 |         
  56 |   <img class='logo shake' src='http://cdn.treelo.xin/avatar.png'/>
  57 | 
  58 | 
  59 |   <div class="m_search">
  60 |     <form name="searchform" class="form u-search-form">
  61 |       <input type="text" class="input u-search-input" placeholder="" />
  62 |       <i class="icon fas fa-search fa-fw"></i>
  63 |     </form>
  64 |   </div>
  65 | 
  66 | <div class='menu navgation'>
  67 |   <ul class='h-list'>
  68 |     
  69 |       
  70 |         <li>
  71 |           <a class="nav home" href="/"
  72 |             
  73 |             
  74 |             id="home">
  75 |             <i class='fas fa-rss fa-fw'></i>&nbsp;博文
  76 |           </a>
  77 |         </li>
  78 |       
  79 |         <li>
  80 |           <a class="nav home" href="/projects/"
  81 |             
  82 |             
  83 |             id="projects">
  84 |             <i class='fas fa-code-branch fa-fw'></i>&nbsp;项目
  85 |           </a>
  86 |         </li>
  87 |       
  88 |         <li>
  89 |           <a class="nav home" href="/friends/"
  90 |             
  91 |               rel="nofollow"
  92 |             
  93 |             
  94 |             id="friends">
  95 |             <i class='fas fa-link fa-fw'></i>&nbsp;友链
  96 |           </a>
  97 |         </li>
  98 |       
  99 |         <li>
 100 |           <a class="nav home" href="/about/"
 101 |             
 102 |               rel="nofollow"
 103 |             
 104 |             
 105 |             id="about">
 106 |             <i class='fas fa-info-circle fa-fw'></i>&nbsp;关于
 107 |           </a>
 108 |         </li>
 109 |       
 110 |     
 111 |   </ul>
 112 | </div>
 113 | 
 114 |       
 115 |     </cover>
 116 |     <header class="l_header pure">
 117 |   <div id="loading-bar-wrapper">
 118 |     <div id="loading-bar" class="pure"></div>
 119 |   </div>
 120 | 
 121 | 	<div class='wrapper'>
 122 | 		<div class="nav-main container container--flex">
 123 |       <a class="logo flat-box" href='/' >
 124 |         
 125 |           搅拌糖
 126 |         
 127 |       </a>
 128 | 			<div class='menu navgation'>
 129 | 				<ul class='h-list'>
 130 |           
 131 |   					
 132 |   						<li>
 133 | 								<a class="nav flat-box" href="/"
 134 |                   
 135 |                   
 136 |                   id="home">
 137 | 									<i class='fas fa-shapes fa-fw'></i>&nbsp;博客
 138 | 								</a>
 139 | 							</li>
 140 |       			
 141 |   						<li>
 142 | 								<a class="nav flat-box" href="/categories/"
 143 |                   
 144 |                     rel="nofollow"
 145 |                   
 146 |                   
 147 |                   id="categories">
 148 | 									<i class='fas fa-calendar-alt fa-fw'></i>&nbsp;归档
 149 | 								</a>
 150 | 							</li>
 151 |       			
 152 |   						<li>
 153 | 								<a class="nav flat-box" href="/2018/11/11/message/"
 154 |                   
 155 |                     rel="nofollow"
 156 |                   
 157 |                   
 158 |                   id="20181111message">
 159 | 									<i class='fas fa-comment-alt fa-fw'></i>&nbsp;留言
 160 | 								</a>
 161 | 							</li>
 162 |       			
 163 |       		
 164 | 				</ul>
 165 | 			</div>
 166 | 
 167 | 			
 168 | 				<div class="m_search">
 169 | 					<form name="searchform" class="form u-search-form">
 170 | 						<input type="text" class="input u-search-input" placeholder="搜索" />
 171 | 						<i class="icon fas fa-search fa-fw"></i>
 172 | 					</form>
 173 | 				</div>
 174 | 			
 175 | 			<ul class='switcher h-list'>
 176 | 				
 177 | 					<li class='s-search'><a class="fas fa-search fa-fw" href='javascript:void(0)' target="_blank" rel="noopener"></a></li>
 178 | 				
 179 | 				<li class='s-menu'><a class="fas fa-bars fa-fw" href='javascript:void(0)' target="_blank" rel="noopener"></a></li>
 180 | 			</ul>
 181 | 		</div>
 182 | 
 183 | 		<div class='nav-sub container container--flex'>
 184 | 			<a class="logo flat-box"></a>
 185 | 			<ul class='switcher h-list'>
 186 | 				<li class='s-comment'><a class="flat-btn fas fa-comments fa-fw" href='javascript:void(0)' target="_blank" rel="noopener"></a></li>
 187 |         
 188 |           <li class='s-toc'><a class="flat-btn fas fa-list fa-fw" href='javascript:void(0)' target="_blank" rel="noopener"></a></li>
 189 |         
 190 | 			</ul>
 191 | 		</div>
 192 | 	</div>
 193 | </header>
 194 | 	<aside class="menu-phone">
 195 |     <header>
 196 | 		<nav class="menu navgation">
 197 |       <ul>
 198 |         
 199 |           
 200 |             <li>
 201 | 							<a class="nav flat-box" href="/"
 202 |                 
 203 |                 
 204 |                 id="home">
 205 | 								<i class='fas fa-shapes fa-fw'></i>&nbsp;博客
 206 | 							</a>
 207 |             </li>
 208 |           
 209 |             <li>
 210 | 							<a class="nav flat-box" href="/categories/"
 211 |                 
 212 |                   rel="nofollow"
 213 |                 
 214 |                 
 215 |                 id="categories">
 216 | 								<i class='fas fa-calendar-alt fa-fw'></i>&nbsp;归档
 217 | 							</a>
 218 |             </li>
 219 |           
 220 |             <li>
 221 | 							<a class="nav flat-box" href="/2018/11/11/message/"
 222 |                 
 223 |                   rel="nofollow"
 224 |                 
 225 |                 
 226 |                 id="20181111message">
 227 | 								<i class='fas fa-comment-alt fa-fw'></i>&nbsp;留言
 228 | 							</a>
 229 |             </li>
 230 |           
 231 |        
 232 |       </ul>
 233 | 		</nav>
 234 |     </header>
 235 | 	</aside>
 236 | <script>setLoadingBarProgress(40);</script>
 237 | 
 238 |   </div>
 239 | 
 240 | 
 241 |   <div class="l_body">
 242 |     <div class='body-wrapper'>
 243 |       
 244 | <div class='l_main'>
 245 |   
 246 |     
 247 |       
 248 |   <section class="post-list">
 249 |     
 250 |       
 251 |         
 252 |           
 253 |         
 254 |       
 255 |     
 256 |     
 257 |       
 258 |         
 259 |           <div class='post-wrapper'>
 260 |             <article class="post reveal banner ">
 261 |   
 262 | 
 263 | 
 264 |   <section class='meta'>
 265 |     
 266 |     
 267 |     <div class="meta" id="header-meta">
 268 |       
 269 |         
 270 |   <h2 class="title">
 271 |     <a href="/2020/01/03/design-singleton/">
 272 |       设计模式-创建型-单例模式(Singleton)
 273 |     </a>
 274 |   </h2>
 275 | 
 276 | 
 277 |       
 278 |       <div class='new-meta-box'>
 279 |         
 280 |           
 281 |         
 282 |           
 283 |             
 284 |   <div class='new-meta-item author'>
 285 |     
 286 |       <a href="https://jiaobantang.github.io" rel="nofollow">
 287 |         
 288 |           <i class="fas fa-user" aria-hidden="true"></i>
 289 |         
 290 |         <p>搅拌糖</p>
 291 |       </a>
 292 |     
 293 |   </div>
 294 | 
 295 | 
 296 |           
 297 |         
 298 |           
 299 |             <div class="new-meta-item date">
 300 |   <a class='notlink'>
 301 |     <i class="fas fa-calendar-alt" aria-hidden="true"></i>
 302 |     <p>2020-01-03</p>
 303 |   </a>
 304 | </div>
 305 | 
 306 |           
 307 |         
 308 |           
 309 |             
 310 |   
 311 |   <div class='new-meta-item category'>
 312 |     <a href='/categories/Coding/Design/' rel="nofollow">
 313 |       <i class="fas fa-folder-open" aria-hidden="true"></i>
 314 |       <p>Coding&nbsp;/&nbsp;Design</p>
 315 |     </a>
 316 |   </div>
 317 | 
 318 | 
 319 |           
 320 |         
 321 |           
 322 |             
 323 | 
 324 |           
 325 |         
 326 |       </div>
 327 |       
 328 |         <hr>
 329 |       
 330 |     </div>
 331 |   </section>
 332 | 
 333 | 
 334 |   <section class="article typo ">
 335 |     <div class="article-entry" itemprop="articleBody">
 336 |       <p>单例模式：使一个类只允许有一个对象的模式</p>
 337 |       
 338 |         <div class="readmore">
 339 |           <a href="/2020/01/03/design-singleton/" class="flat-box">
 340 |             <i class="fas fa-book-open fa-fw" aria-hidden="true"></i>
 341 |             阅读全文
 342 |           </a>
 343 |         </div>
 344 |       
 345 |     </div>
 346 |     
 347 |       <div class="full-width auto-padding tags">
 348 |         
 349 |           <a href="/tags/%E8%AE%BE%E8%AE%A1%E6%A8%A1%E5%BC%8F/" rel="nofollow"><i class="fas fa-tag fa-fw"></i> 设计模式</a>
 350 |         
 351 |       </div>
 352 |     
 353 |   </section>
 354 | </article>
 355 | 
 356 |           </div>
 357 |         
 358 |       
 359 |     
 360 |   </section>
 361 |   
 362 |     
 363 |     <!-- 根据主题中的设置决定是否在archive中针对摘要部分的MathJax公式加载mathjax.js文件 -->
 364 |     
 365 |     
 366 | 
 367 |   
 368 | 
 369 | 
 370 |     
 371 |   
 372 | 
 373 | </div>
 374 | <aside class='l_side'>
 375 |   
 376 |     
 377 |     
 378 |       
 379 |       
 380 |         
 381 |           
 382 |           
 383 |             
 384 |               <section class='widget shake author'>
 385 |   <div class='content pure'>
 386 |     
 387 |       <div class='avatar'>
 388 |         <img class='avatar' src='http://cdn.treelo.xin/avatar.png'/>
 389 |       </div>
 390 |     
 391 |     
 392 |     
 393 |       <div class="social-wrapper">
 394 |         
 395 |           
 396 |             <a href="/mailto:847280718@qq.com"
 397 |               class="social fas fa-envelope flat-btn"
 398 |               target="_blank"
 399 |               rel="external nofollow noopener noreferrer">
 400 |             </a>
 401 |           
 402 |         
 403 |           
 404 |             <a href="https://github.com/JIAOBANTANG"
 405 |               class="social fab fa-github flat-btn"
 406 |               target="_blank"
 407 |               rel="external nofollow noopener noreferrer">
 408 |             </a>
 409 |           
 410 |         
 411 |           
 412 |             <a href="https://codepen.io/jiaobantang/pens/public/"
 413 |               class="social fab fa-codepen flat-btn"
 414 |               target="_blank"
 415 |               rel="external nofollow noopener noreferrer">
 416 |             </a>
 417 |           
 418 |         
 419 |           
 420 |             <a href="https://music.163.com/#/user/home?id=65219633"
 421 |               class="social fas fa-headphones-alt flat-btn"
 422 |               target="_blank"
 423 |               rel="external nofollow noopener noreferrer">
 424 |             </a>
 425 |           
 426 |         
 427 |       </div>
 428 |     
 429 |   </div>
 430 | </section>
 431 | 
 432 |             
 433 |           
 434 |         
 435 |           
 436 |           
 437 |         
 438 |           
 439 |           
 440 |         
 441 |           
 442 |           
 443 |         
 444 |           
 445 |           
 446 |         
 447 |           
 448 |           
 449 |         
 450 |       
 451 |         
 452 |           
 453 |           
 454 |         
 455 |           
 456 |           
 457 |         
 458 |           
 459 |           
 460 |         
 461 |           
 462 |           
 463 |         
 464 |           
 465 |           
 466 |         
 467 |           
 468 |           
 469 |             
 470 |               <section class='widget list'>
 471 |   
 472 | <header class='pure'>
 473 |   <div><i class="fas fa-thumbs-up fa-fw" aria-hidden="true"></i>&nbsp;&nbsp;强烈推荐</div>
 474 |   
 475 | </header>
 476 | 
 477 |   <div class='content pure'>
 478 |     <ul class="entry">
 479 |       
 480 |         <li><a class="flat-box" title="/2019/06/09/photo-map/" href="/2019/06/09/photo-map/"
 481 |           
 482 |           
 483 |           >
 484 |           <div class='name'>
 485 |             
 486 |               <i class=" fa-fw" aria-hidden="true"></i>
 487 |             
 488 |             &nbsp;&nbsp;地图相册
 489 |           </div>
 490 |           
 491 |         </a></li>
 492 |       
 493 |     </ul>
 494 |   </div>
 495 | </section>
 496 | 
 497 |             
 498 |           
 499 |         
 500 |       
 501 |         
 502 |           
 503 |           
 504 |         
 505 |           
 506 |           
 507 |         
 508 |           
 509 |           
 510 |             
 511 |               <section class='widget grid'>
 512 |   
 513 | <header class='pure'>
 514 |   <div><i class="fas fa-map-signs fa-fw" aria-hidden="true"></i>&nbsp;&nbsp;站内导航</div>
 515 |   
 516 | </header>
 517 | 
 518 |   <div class='content pure'>
 519 |     <ul class="grid navgation">
 520 |       
 521 |         <li><a class="flat-box" title="/" href="/"
 522 |           
 523 |           
 524 |           id="home">
 525 |           
 526 |             <i class="fas fa-clock fa-fw" aria-hidden="true"></i>
 527 |           
 528 |           近期文章
 529 |         </a></li>
 530 |       
 531 |         <li><a class="flat-box" title="/archives/" href="/archives/"
 532 |           
 533 |             rel="nofollow"
 534 |           
 535 |           
 536 |           id="archives">
 537 |           
 538 |             <i class="fas fa-archive fa-fw" aria-hidden="true"></i>
 539 |           
 540 |           文章归档
 541 |         </a></li>
 542 |       
 543 |         <li><a class="flat-box" title="/projects/" href="/projects/"
 544 |           
 545 |           
 546 |           id="projects">
 547 |           
 548 |             <i class="fas fa-code-branch fa-fw" aria-hidden="true"></i>
 549 |           
 550 |           开源项目
 551 |         </a></li>
 552 |       
 553 |         <li><a class="flat-box" title="/friends/" href="/friends/"
 554 |           
 555 |             rel="nofollow"
 556 |           
 557 |           
 558 |           id="friends">
 559 |           
 560 |             <i class="fas fa-link fa-fw" aria-hidden="true"></i>
 561 |           
 562 |           我的友链
 563 |         </a></li>
 564 |       
 565 |         <li><a class="flat-box" title="/about/" href="/about/"
 566 |           
 567 |             rel="nofollow"
 568 |           
 569 |           
 570 |           id="about">
 571 |           
 572 |             <i class="fas fa-info-circle fa-fw" aria-hidden="true"></i>
 573 |           
 574 |           关于小站
 575 |         </a></li>
 576 |       
 577 |     </ul>
 578 |   </div>
 579 | </section>
 580 | 
 581 |             
 582 |           
 583 |         
 584 |           
 585 |           
 586 |         
 587 |           
 588 |           
 589 |         
 590 |           
 591 |           
 592 |         
 593 |       
 594 |         
 595 |           
 596 |           
 597 |         
 598 |           
 599 |           
 600 |         
 601 |           
 602 |           
 603 |         
 604 |           
 605 |           
 606 |             
 607 |               
 608 |   <section class='widget category'>
 609 |     
 610 | <header class='pure'>
 611 |   <div><i class="fas fa-folder-open fa-fw" aria-hidden="true"></i>&nbsp;&nbsp;文章分类</div>
 612 |   
 613 |     <a class="rightBtn"
 614 |     
 615 |       rel="nofollow"
 616 |     
 617 |     
 618 |     href="/blog/categories/"
 619 |     title="blog/categories/">
 620 |     <i class="fas fa-expand-arrows-alt fa-fw"></i></a>
 621 |   
 622 | </header>
 623 | 
 624 |     <div class='content pure'>
 625 |       <ul class="entry">
 626 |         
 627 |           <li><a class="flat-box" title="/categories/Coding/" href="/categories/Coding/"><div class='name'>Coding</div><div class='badge'>(19)</div></a></li>
 628 |         
 629 |           <li><a class="flat-box child" title="/categories/Coding/Design/" href="/categories/Coding/Design/"><div class='name'>Design</div><div class='badge'>(1)</div></a></li>
 630 |         
 631 |           <li><a class="flat-box child" title="/categories/Coding/Docker/" href="/categories/Coding/Docker/"><div class='name'>Docker</div><div class='badge'>(5)</div></a></li>
 632 |         
 633 |           <li><a class="flat-box child" title="/categories/Coding/JS/" href="/categories/Coding/JS/"><div class='name'>JS</div><div class='badge'>(1)</div></a></li>
 634 |         
 635 |           <li><a class="flat-box child" title="/categories/Coding/MySQL/" href="/categories/Coding/MySQL/"><div class='name'>MySQL</div><div class='badge'>(3)</div></a></li>
 636 |         
 637 |           <li><a class="flat-box child" title="/categories/Coding/PHP/" href="/categories/Coding/PHP/"><div class='name'>PHP</div><div class='badge'>(2)</div></a></li>
 638 |         
 639 |           <li><a class="flat-box child" title="/categories/Coding/PSR/" href="/categories/Coding/PSR/"><div class='name'>PSR</div><div class='badge'>(1)</div></a></li>
 640 |         
 641 |           <li><a class="flat-box child" title="/categories/Coding/Swoole/" href="/categories/Coding/Swoole/"><div class='name'>Swoole</div><div class='badge'>(1)</div></a></li>
 642 |         
 643 |           <li><a class="flat-box child" title="/categories/Coding/Web/" href="/categories/Coding/Web/"><div class='name'>Web</div><div class='badge'>(3)</div></a></li>
 644 |         
 645 |           <li><a class="flat-box" title="/categories/PHP/" href="/categories/PHP/"><div class='name'>PHP</div><div class='badge'>(1)</div></a></li>
 646 |         
 647 |           <li><a class="flat-box" title="/categories/Self/" href="/categories/Self/"><div class='name'>Self</div><div class='badge'>(1)</div></a></li>
 648 |         
 649 |           <li><a class="flat-box" title="/categories/%E8%A1%80%E5%B0%8F%E6%9D%BF/" href="/categories/%E8%A1%80%E5%B0%8F%E6%9D%BF/"><div class='name'>血小板</div><div class='badge'>(1)</div></a></li>
 650 |         
 651 |       </ul>
 652 |     </div>
 653 |   </section>
 654 | 
 655 | 
 656 |             
 657 |           
 658 |         
 659 |           
 660 |           
 661 |         
 662 |           
 663 |           
 664 |         
 665 |       
 666 |         
 667 |           
 668 |           
 669 |         
 670 |           
 671 |           
 672 |         
 673 |           
 674 |           
 675 |         
 676 |           
 677 |           
 678 |         
 679 |           
 680 |           
 681 |             
 682 |               
 683 |   <section class='widget tagcloud'>
 684 |     
 685 | <header class='pure'>
 686 |   <div><i class="fas fa-tags fa-fw" aria-hidden="true"></i>&nbsp;&nbsp;热门标签</div>
 687 |   
 688 |     <a class="rightBtn"
 689 |     
 690 |       rel="nofollow"
 691 |     
 692 |     
 693 |     href="/blog/tags/"
 694 |     title="blog/tags/">
 695 |     <i class="fas fa-expand-arrows-alt fa-fw"></i></a>
 696 |   
 697 | </header>
 698 | 
 699 |     <div class='content pure'>
 700 |       <a href="/tags/Coding/" style="font-size: 20.67px; color: #6c6c6c">Coding</a> <a href="/tags/Cool/" style="font-size: 14px; color: #999">Cool</a> <a href="/tags/JavaScript/" style="font-size: 14px; color: #999">JavaScript</a> <a href="/tags/MySQL/" style="font-size: 17.33px; color: #828282">MySQL</a> <a href="/tags/OOP/" style="font-size: 14px; color: #999">OOP</a> <a href="/tags/PDO/" style="font-size: 14px; color: #999">PDO</a> <a href="/tags/PHP/" style="font-size: 14px; color: #999">PHP</a> <a href="/tags/Swoole/" style="font-size: 14px; color: #999">Swoole</a> <a href="/tags/docker/" style="font-size: 24px; color: #555">docker</a> <a href="/tags/live2D/" style="font-size: 14px; color: #999">live2D</a> <a href="/tags/nginx/" style="font-size: 14px; color: #999">nginx</a> <a href="/tags/php/" style="font-size: 14px; color: #999">php</a> <a href="/tags/snowflake/" style="font-size: 14px; color: #999">snowflake</a> <a href="/tags/%E5%9C%B0%E5%9B%BE%E7%9B%B8%E5%86%8C/" style="font-size: 14px; color: #999">地图相册</a> <a href="/tags/%E6%8E%A5%E5%8F%A3%E5%BC%80%E5%8F%91/" style="font-size: 14px; color: #999">接口开发</a> <a href="/tags/%E6%94%B9%E5%8F%98/" style="font-size: 14px; color: #999">改变</a> <a href="/tags/%E6%97%A5%E7%AD%BE/" style="font-size: 14px; color: #999">日签</a> <a href="/tags/%E6%9C%8D%E5%8A%A1%E7%AB%AF/" style="font-size: 14px; color: #999">服务端</a> <a href="/tags/%E7%B3%96%E7%B3%96%E6%97%A5%E7%AD%BE/" style="font-size: 14px; color: #999">糖糖日签</a> <a href="/tags/%E8%87%AA%E6%88%91%E5%8F%91%E5%B1%95/" style="font-size: 14px; color: #999">自我发展</a> <a href="/tags/%E8%A1%80%E5%B0%8F%E6%9D%BF/" style="font-size: 14px; color: #999">血小板</a> <a href="/tags/%E8%AE%BE%E8%AE%A1%E6%A8%A1%E5%BC%8F/" style="font-size: 14px; color: #999">设计模式</a>
 701 |     </div>
 702 |   </section>
 703 | 
 704 | 
 705 |             
 706 |           
 707 |         
 708 |           
 709 |           
 710 |         
 711 |       
 712 |     
 713 | 
 714 |   
 715 | </aside>
 716 | 
 717 | <footer id="footer" class="clearfix">
 718 |   
 719 |   
 720 |     <div class="social-wrapper">
 721 |       
 722 |         
 723 |           <a href="/mailto:847280718@qq.com"
 724 |             class="social fas fa-envelope flat-btn"
 725 |             target="_blank"
 726 |             rel="external nofollow noopener noreferrer">
 727 |           </a>
 728 |         
 729 |       
 730 |         
 731 |           <a href="https://github.com/JIAOBANTANG"
 732 |             class="social fab fa-github flat-btn"
 733 |             target="_blank"
 734 |             rel="external nofollow noopener noreferrer">
 735 |           </a>
 736 |         
 737 |       
 738 |         
 739 |           <a href="https://codepen.io/jiaobantang/pens/public/"
 740 |             class="social fab fa-codepen flat-btn"
 741 |             target="_blank"
 742 |             rel="external nofollow noopener noreferrer">
 743 |           </a>
 744 |         
 745 |       
 746 |         
 747 |           <a href="https://music.163.com/#/user/home?id=65219633"
 748 |             class="social fas fa-headphones-alt flat-btn"
 749 |             target="_blank"
 750 |             rel="external nofollow noopener noreferrer">
 751 |           </a>
 752 |         
 753 |       
 754 |     </div>
 755 |   
 756 |   <br>
 757 |   <div>
 758 |     <div class="footer">
 759 |       <p><span style="color:rgb(61, 197, 80);">种一棵树最好的时间是十年前，其次是现在</span></p>
 760 | 
 761 |     </div>
 762 | 
 763 |   </div>
 764 |   <!-- <div><p>Blog content follows the <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/deed.en" target="_blank" rel="noopener">Attribution-NonCommercial-ShareAlike 4.0 International (CC BY-NC-SA 4.0) License</a></p>
 765 | </div> -->
 766 |   <div>
 767 |     本站使用
 768 |     <a href="https://xaoxuu.com/wiki/material-x/" target="_blank" class="codename">Material X</a>
 769 |     作为主题
 770 |     
 771 |       ，
 772 |       总访问量为
 773 |       <span id="busuanzi_value_site_pv"><i class="fas fa-spinner fa-spin fa-fw" aria-hidden="true"></i></span>
 774 |       次
 775 |     
 776 |     。
 777 |   </div>
 778 |   <div id="sitetime"></div>
 779 | </footer>
 780 | <script>setLoadingBarProgress(80);</script>
 781 | <script src="https://cdn.bootcss.com/jquery/3.3.0/jquery.min.js"></script>
 782 | <!-- 血小板 -->
 783 | <div id="landlord">
 784 |   <div class="message" style="opacity:0"></div>
 785 |   <canvas id="live2d" width="560" height="500" class="live2d"></canvas>
 786 |   <div class="hide-button">隐藏</div>
 787 | </div>
 788 | <!-- 血小板-->
 789 | <script type="text/javascript">
 790 |   var message_Path = '/live2d/'
 791 | </script>
 792 | <script type="text/javascript" src="/live2d/js/live2d.js"></script>
 793 | <script type="text/javascript" src="/live2d/js/message.js"></script>
 794 | <script type="text/javascript">
 795 |   loadlive2d("live2d", "/live2d/model/xiaoban/model.json");
 796 | </script>
 797 | <!-- 点击特效，输入特效 运行时间 -->
 798 | <script type="text/javascript" src="/cool/cooltext.js"></script>
 799 | <script type="text/javascript" src="/cool/clicklove.js"></script>
 800 | <script type="text/javascript" src="/cool/sitetime.js"></script>
 801 | <script type="text/javascript" src="/cool/banner.js"></script>
 802 | 
 803 | 
 804 |       <script>setLoadingBarProgress(60);</script>
 805 |     </div>
 806 |     <a class="s-top fas fa-arrow-up fa-fw" href='javascript:void(0)' target="_blank" rel="noopener"></a>
 807 |   </div>
 808 |   <script src="https://cdn.jsdelivr.net/npm/jquery@3.3.1/dist/jquery.min.js"></script>
 809 | 
 810 |   <script>
 811 |     var GOOGLE_CUSTOM_SEARCH_API_KEY = "";
 812 |     var GOOGLE_CUSTOM_SEARCH_ENGINE_ID = "";
 813 |     var ALGOLIA_API_KEY = "";
 814 |     var ALGOLIA_APP_ID = "";
 815 |     var ALGOLIA_INDEX_NAME = "";
 816 |     var AZURE_SERVICE_NAME = "";
 817 |     var AZURE_INDEX_NAME = "";
 818 |     var AZURE_QUERY_KEY = "";
 819 |     var BAIDU_API_ID = "";
 820 |     var SEARCH_SERVICE = "hexo" || "hexo";
 821 |     var ROOT = "/"||"/";
 822 |     if(!ROOT.endsWith('/'))ROOT += '/';
 823 |   </script>
 824 | 
 825 | <script src="//instant.page/1.2.2" type="module" integrity="sha384-2xV8M5griQmzyiY3CDqh1dn4z3llDVqZDqzjzcY+jCBCk/a5fXJmuZ/40JJAPeoU"></script>
 826 | 
 827 | 
 828 |   <script async src="https://cdn.jsdelivr.net/npm/scrollreveal@4.0.5/dist/scrollreveal.min.js"></script>
 829 |   <script type="text/javascript">
 830 |     $(function() {
 831 |       const $reveal = $('.reveal');
 832 |       if ($reveal.length === 0) return;
 833 |       const sr = ScrollReveal({ distance: 0 });
 834 |       sr.reveal('.reveal');
 835 |     });
 836 |   </script>
 837 | 
 838 | 
 839 |   <script src="https://cdn.jsdelivr.net/npm/node-waves@0.7.6/dist/waves.min.js"></script>
 840 |   <script type="text/javascript">
 841 |     $(function() {
 842 |       Waves.attach('.flat-btn', ['waves-button']);
 843 |       Waves.attach('.float-btn', ['waves-button', 'waves-float']);
 844 |       Waves.attach('.float-btn-light', ['waves-button', 'waves-float', 'waves-light']);
 845 |       Waves.attach('.flat-box', ['waves-block']);
 846 |       Waves.attach('.float-box', ['waves-block', 'waves-float']);
 847 |       Waves.attach('.waves-image');
 848 |       Waves.init();
 849 |     });
 850 |   </script>
 851 | 
 852 | 
 853 |   <script async src="https://cdn.jsdelivr.net/gh/xaoxuu/cdn-busuanzi@2.3/js/busuanzi.pure.mini.js"></script>
 854 | 
 855 | 
 856 | 
 857 | 
 858 |   
 859 |   
 860 |   
 861 |     <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-backstretch/2.0.4/jquery.backstretch.min.js"></script>
 862 |     <script type="text/javascript">
 863 |       $(function(){
 864 |         if ('.cover') {
 865 |           $('.cover').backstretch(
 866 |           ["https://img.vim-cn.com/29/91197b04c13f512f734a76d4ac422d89dbe229.jpg"],
 867 |           {
 868 |             duration: "6000",
 869 |             fade: "2500"
 870 |           });
 871 |         } else {
 872 |           $.backstretch(
 873 |           ["https://img.vim-cn.com/29/91197b04c13f512f734a76d4ac422d89dbe229.jpg"],
 874 |           {
 875 |             duration: "6000",
 876 |             fade: "2500"
 877 |           });
 878 |         }
 879 |       });
 880 |     </script>
 881 |   
 882 | 
 883 | 
 884 | 
 885 | 
 886 | 
 887 | 
 888 | 
 889 | 
 890 | 
 891 | 
 892 | 
 893 |   <script src="https://cdn.jsdelivr.net/gh/xaoxuu/cdn-material-x@19.9/js/app.js"></script>
 894 | 
 895 | 
 896 |   <script src="https://cdn.jsdelivr.net/gh/xaoxuu/cdn-material-x@19.9/js/search.js"></script>
 897 | 
 898 | 
 899 | 
 900 | 
 901 | <!-- 复制 -->
 902 | <script src="https://cdn.jsdelivr.net/npm/clipboard@2/dist/clipboard.min.js"></script>
 903 | <script>
 904 |   let COPY_SUCCESS = "复制成功";
 905 |   let COPY_FAILURE = "复制失败";
 906 |   /*页面载入完成后，创建复制按钮*/
 907 |   !function (e, t, a) {
 908 |     /* code */
 909 |     var initCopyCode = function(){
 910 |       var copyHtml = '';
 911 |       copyHtml += '<button class="btn-copy" data-clipboard-snippet="">';
 912 |       copyHtml += '  <i class="fa fa-copy"></i><span>复制</span>';
 913 |       copyHtml += '</button>';
 914 |       $(".highlight .code pre").before(copyHtml);
 915 |       var clipboard = new ClipboardJS('.btn-copy', {
 916 |         target: function(trigger) {
 917 |           return trigger.nextElementSibling;
 918 |         }
 919 |       });
 920 | 
 921 |       clipboard.on('success', function(e) {
 922 |         //您可以加入成功提示
 923 |         console.info('Action:', e.action);
 924 |         console.info('Text:', e.text);
 925 |         console.info('Trigger:', e.trigger);
 926 |         success_prompt(COPY_SUCCESS);
 927 |         e.clearSelection();
 928 |       });
 929 |       clipboard.on('error', function(e) {
 930 |         //您可以加入失败提示
 931 |         console.error('Action:', e.action);
 932 |         console.error('Trigger:', e.trigger);
 933 |         fail_prompt(COPY_FAILURE);
 934 |       });
 935 |     }
 936 |     initCopyCode();
 937 | 
 938 |   }(window, document);
 939 | 
 940 |   /**
 941 |    * 弹出式提示框，默认1.5秒自动消失
 942 |    * @param message 提示信息
 943 |    * @param style 提示样式，有alert-success、alert-danger、alert-warning、alert-info
 944 |    * @param time 消失时间
 945 |    */
 946 |   var prompt = function (message, style, time)
 947 |   {
 948 |       style = (style === undefined) ? 'alert-success' : style;
 949 |       time = (time === undefined) ? 1500 : time*1000;
 950 |       $('<div>')
 951 |           .appendTo('body')
 952 |           .addClass('alert ' + style)
 953 |           .html(message)
 954 |           .show()
 955 |           .delay(time)
 956 |           .fadeOut();
 957 |   };
 958 | 
 959 |   // 成功提示
 960 |   var success_prompt = function(message, time)
 961 |   {
 962 |       prompt(message, 'alert-success', time);
 963 |   };
 964 | 
 965 |   // 失败提示
 966 |   var fail_prompt = function(message, time)
 967 |   {
 968 |       prompt(message, 'alert-danger', time);
 969 |   };
 970 | 
 971 |   // 提醒
 972 |   var warning_prompt = function(message, time)
 973 |   {
 974 |       prompt(message, 'alert-warning', time);
 975 |   };
 976 | 
 977 |   // 信息提示
 978 |   var info_prompt = function(message, time)
 979 |   {
 980 |       prompt(message, 'alert-info', time);
 981 |   };
 982 | 
 983 | </script>
 984 | 
 985 | 
 986 | <!-- fancybox -->
 987 | <script src="https://cdn.jsdelivr.net/gh/fancyapps/fancybox@3.5.7/dist/jquery.fancybox.min.js"></script>
 988 | <script>
 989 |   let LAZY_LOAD_IMAGE = "";
 990 |   $(".article-entry").find("fancybox").find("img").each(function () {
 991 |       var element = document.createElement("a");
 992 |       $(element).attr("data-fancybox", "gallery");
 993 |       $(element).attr("href", $(this).attr("src"));
 994 |       /* 图片采用懒加载处理时,
 995 |        * 一般图片标签内会有个属性名来存放图片的真实地址，比如 data-original,
 996 |        * 那么此处将原本的属性名src替换为对应属性名data-original,
 997 |        * 修改如下
 998 |        */
 999 |        if (LAZY_LOAD_IMAGE) {
1000 |          $(element).attr("href", $(this).attr("data-original"));
1001 |        }
1002 |       $(this).wrap(element);
1003 |   });
1004 | </script>
1005 | 
1006 | 
1007 | 
1008 | 
1009 | 
1010 |   <script>setLoadingBarProgress(100);</script>
1011 | </body>
1012 | </html>
1013 | 


--------------------------------------------------------------------------------
/tags/Swoole/index.html:
--------------------------------------------------------------------------------
   1 | <!DOCTYPE html>
   2 | <html>
   3 | <head>
   4 |   <meta charset="utf-8">
   5 |   <meta http-equiv="X-UA-Compatible" content="IE=edge" />
   6 |   
   7 |   <title>Tag: Swoole | 搅拌糖</title>
   8 |   
   9 |   <meta name="keywords" content="搅拌糖,搅拌糖°,搅拌糖的个人博客">
  10 |   
  11 |   
  12 |   <meta name="description" content="种一棵树最好的时间是十年前，其次是现在">
  13 |   
  14 | 
  15 |   
  16 |   <link rel="shortcut icon" type="image/ico" href="/favicon.ico"/>
  17 |   <meta name="HandheldFriendly" content="True" />
  18 |   <meta name="apple-mobile-web-app-capable" content="yes">
  19 |   <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  20 |   <!-- meta -->
  21 |   
  22 | 
  23 |   <!-- link -->
  24 |   <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/fancyapps/fancybox@3.5.7/dist/jquery.fancybox.min.css" />
  25 |   
  26 |   <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/node-waves@0.7.6/dist/waves.min.css">
  27 |   
  28 |   <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@5.10.1/css/all.min.css">
  29 |   
  30 | 
  31 |   
  32 | 
  33 |   
  34 |     <link rel="stylesheet" href="/style.css">
  35 |   
  36 | 
  37 |   <script>
  38 |     function setLoadingBarProgress(num) {
  39 |       document.getElementById('loading-bar').style.width=num+"%";
  40 |     }
  41 |   </script>
  42 | 
  43 |   
  44 |   
  45 |   <!-- 血小板-->
  46 | <link rel="stylesheet" href="/live2d/css/live2d.css" />
  47 | </head>
  48 | 
  49 | <body>
  50 |   
  51 |   
  52 |   <div class="cover-wrapper">
  53 |     <cover class='cover  half'>
  54 |       
  55 |         
  56 |   <img class='logo shake' src='http://cdn.treelo.xin/avatar.png'/>
  57 | 
  58 | 
  59 |   <div class="m_search">
  60 |     <form name="searchform" class="form u-search-form">
  61 |       <input type="text" class="input u-search-input" placeholder="" />
  62 |       <i class="icon fas fa-search fa-fw"></i>
  63 |     </form>
  64 |   </div>
  65 | 
  66 | <div class='menu navgation'>
  67 |   <ul class='h-list'>
  68 |     
  69 |       
  70 |         <li>
  71 |           <a class="nav home" href="/"
  72 |             
  73 |             
  74 |             id="home">
  75 |             <i class='fas fa-rss fa-fw'></i>&nbsp;博文
  76 |           </a>
  77 |         </li>
  78 |       
  79 |         <li>
  80 |           <a class="nav home" href="/projects/"
  81 |             
  82 |             
  83 |             id="projects">
  84 |             <i class='fas fa-code-branch fa-fw'></i>&nbsp;项目
  85 |           </a>
  86 |         </li>
  87 |       
  88 |         <li>
  89 |           <a class="nav home" href="/friends/"
  90 |             
  91 |               rel="nofollow"
  92 |             
  93 |             
  94 |             id="friends">
  95 |             <i class='fas fa-link fa-fw'></i>&nbsp;友链
  96 |           </a>
  97 |         </li>
  98 |       
  99 |         <li>
 100 |           <a class="nav home" href="/about/"
 101 |             
 102 |               rel="nofollow"
 103 |             
 104 |             
 105 |             id="about">
 106 |             <i class='fas fa-info-circle fa-fw'></i>&nbsp;关于
 107 |           </a>
 108 |         </li>
 109 |       
 110 |     
 111 |   </ul>
 112 | </div>
 113 | 
 114 |       
 115 |     </cover>
 116 |     <header class="l_header pure">
 117 |   <div id="loading-bar-wrapper">
 118 |     <div id="loading-bar" class="pure"></div>
 119 |   </div>
 120 | 
 121 | 	<div class='wrapper'>
 122 | 		<div class="nav-main container container--flex">
 123 |       <a class="logo flat-box" href='/' >
 124 |         
 125 |           搅拌糖
 126 |         
 127 |       </a>
 128 | 			<div class='menu navgation'>
 129 | 				<ul class='h-list'>
 130 |           
 131 |   					
 132 |   						<li>
 133 | 								<a class="nav flat-box" href="/"
 134 |                   
 135 |                   
 136 |                   id="home">
 137 | 									<i class='fas fa-shapes fa-fw'></i>&nbsp;博客
 138 | 								</a>
 139 | 							</li>
 140 |       			
 141 |   						<li>
 142 | 								<a class="nav flat-box" href="/categories/"
 143 |                   
 144 |                     rel="nofollow"
 145 |                   
 146 |                   
 147 |                   id="categories">
 148 | 									<i class='fas fa-calendar-alt fa-fw'></i>&nbsp;归档
 149 | 								</a>
 150 | 							</li>
 151 |       			
 152 |   						<li>
 153 | 								<a class="nav flat-box" href="/2018/11/11/message/"
 154 |                   
 155 |                     rel="nofollow"
 156 |                   
 157 |                   
 158 |                   id="20181111message">
 159 | 									<i class='fas fa-comment-alt fa-fw'></i>&nbsp;留言
 160 | 								</a>
 161 | 							</li>
 162 |       			
 163 |       		
 164 | 				</ul>
 165 | 			</div>
 166 | 
 167 | 			
 168 | 				<div class="m_search">
 169 | 					<form name="searchform" class="form u-search-form">
 170 | 						<input type="text" class="input u-search-input" placeholder="搜索" />
 171 | 						<i class="icon fas fa-search fa-fw"></i>
 172 | 					</form>
 173 | 				</div>
 174 | 			
 175 | 			<ul class='switcher h-list'>
 176 | 				
 177 | 					<li class='s-search'><a class="fas fa-search fa-fw" href='javascript:void(0)' target="_blank" rel="noopener"></a></li>
 178 | 				
 179 | 				<li class='s-menu'><a class="fas fa-bars fa-fw" href='javascript:void(0)' target="_blank" rel="noopener"></a></li>
 180 | 			</ul>
 181 | 		</div>
 182 | 
 183 | 		<div class='nav-sub container container--flex'>
 184 | 			<a class="logo flat-box"></a>
 185 | 			<ul class='switcher h-list'>
 186 | 				<li class='s-comment'><a class="flat-btn fas fa-comments fa-fw" href='javascript:void(0)' target="_blank" rel="noopener"></a></li>
 187 |         
 188 |           <li class='s-toc'><a class="flat-btn fas fa-list fa-fw" href='javascript:void(0)' target="_blank" rel="noopener"></a></li>
 189 |         
 190 | 			</ul>
 191 | 		</div>
 192 | 	</div>
 193 | </header>
 194 | 	<aside class="menu-phone">
 195 |     <header>
 196 | 		<nav class="menu navgation">
 197 |       <ul>
 198 |         
 199 |           
 200 |             <li>
 201 | 							<a class="nav flat-box" href="/"
 202 |                 
 203 |                 
 204 |                 id="home">
 205 | 								<i class='fas fa-shapes fa-fw'></i>&nbsp;博客
 206 | 							</a>
 207 |             </li>
 208 |           
 209 |             <li>
 210 | 							<a class="nav flat-box" href="/categories/"
 211 |                 
 212 |                   rel="nofollow"
 213 |                 
 214 |                 
 215 |                 id="categories">
 216 | 								<i class='fas fa-calendar-alt fa-fw'></i>&nbsp;归档
 217 | 							</a>
 218 |             </li>
 219 |           
 220 |             <li>
 221 | 							<a class="nav flat-box" href="/2018/11/11/message/"
 222 |                 
 223 |                   rel="nofollow"
 224 |                 
 225 |                 
 226 |                 id="20181111message">
 227 | 								<i class='fas fa-comment-alt fa-fw'></i>&nbsp;留言
 228 | 							</a>
 229 |             </li>
 230 |           
 231 |        
 232 |       </ul>
 233 | 		</nav>
 234 |     </header>
 235 | 	</aside>
 236 | <script>setLoadingBarProgress(40);</script>
 237 | 
 238 |   </div>
 239 | 
 240 | 
 241 |   <div class="l_body">
 242 |     <div class='body-wrapper'>
 243 |       
 244 | <div class='l_main'>
 245 |   
 246 |     
 247 |       
 248 |   <section class="post-list">
 249 |     
 250 |       
 251 |         
 252 |           
 253 |         
 254 |       
 255 |     
 256 |     
 257 |       
 258 |         
 259 |           <div class='post-wrapper'>
 260 |             <article class="post reveal banner ">
 261 |   
 262 | 
 263 | 
 264 |   <section class='meta'>
 265 |     
 266 |     
 267 |     <div class="meta" id="header-meta">
 268 |       
 269 |         
 270 |   <h2 class="title">
 271 |     <a href="/2020/01/03/swoole-coroutine/">
 272 |       Swoole-协程概述
 273 |     </a>
 274 |   </h2>
 275 | 
 276 | 
 277 |       
 278 |       <div class='new-meta-box'>
 279 |         
 280 |           
 281 |         
 282 |           
 283 |             
 284 |   <div class='new-meta-item author'>
 285 |     
 286 |       <a href="https://jiaobantang.github.io" rel="nofollow">
 287 |         
 288 |           <i class="fas fa-user" aria-hidden="true"></i>
 289 |         
 290 |         <p>搅拌糖</p>
 291 |       </a>
 292 |     
 293 |   </div>
 294 | 
 295 | 
 296 |           
 297 |         
 298 |           
 299 |             <div class="new-meta-item date">
 300 |   <a class='notlink'>
 301 |     <i class="fas fa-calendar-alt" aria-hidden="true"></i>
 302 |     <p>2020-01-03</p>
 303 |   </a>
 304 | </div>
 305 | 
 306 |           
 307 |         
 308 |           
 309 |             
 310 |   
 311 |   <div class='new-meta-item category'>
 312 |     <a href='/categories/Coding/Swoole/' rel="nofollow">
 313 |       <i class="fas fa-folder-open" aria-hidden="true"></i>
 314 |       <p>Coding&nbsp;/&nbsp;Swoole</p>
 315 |     </a>
 316 |   </div>
 317 | 
 318 | 
 319 |           
 320 |         
 321 |           
 322 |             
 323 | 
 324 |           
 325 |         
 326 |       </div>
 327 |       
 328 |         <hr>
 329 |       
 330 |     </div>
 331 |   </section>
 332 | 
 333 | 
 334 |   <section class="article typo ">
 335 |     <div class="article-entry" itemprop="articleBody">
 336 |       <p><img src="https://imgkr.cn-bj.ufileos.com/3f8987e9-b28e-49c8-808f-504dd0d51ed9.png" alt=""></p>
 337 |       
 338 |         <div class="readmore">
 339 |           <a href="/2020/01/03/swoole-coroutine/" class="flat-box">
 340 |             <i class="fas fa-book-open fa-fw" aria-hidden="true"></i>
 341 |             阅读全文
 342 |           </a>
 343 |         </div>
 344 |       
 345 |     </div>
 346 |     
 347 |       <div class="full-width auto-padding tags">
 348 |         
 349 |           <a href="/tags/Swoole/" rel="nofollow"><i class="fas fa-tag fa-fw"></i> Swoole</a>
 350 |         
 351 |       </div>
 352 |     
 353 |   </section>
 354 | </article>
 355 | 
 356 |           </div>
 357 |         
 358 |       
 359 |     
 360 |   </section>
 361 |   
 362 |     
 363 |     <!-- 根据主题中的设置决定是否在archive中针对摘要部分的MathJax公式加载mathjax.js文件 -->
 364 |     
 365 |     
 366 | 
 367 |   
 368 | 
 369 | 
 370 |     
 371 |   
 372 | </div>
 373 | <aside class='l_side'>
 374 |   
 375 |     
 376 |     
 377 |       
 378 |       
 379 |         
 380 |           
 381 |           
 382 |             
 383 |               <section class='widget shake author'>
 384 |   <div class='content pure'>
 385 |     
 386 |       <div class='avatar'>
 387 |         <img class='avatar' src='http://cdn.treelo.xin/avatar.png'/>
 388 |       </div>
 389 |     
 390 |     
 391 |     
 392 |       <div class="social-wrapper">
 393 |         
 394 |           
 395 |             <a href="/mailto:847280718@qq.com"
 396 |               class="social fas fa-envelope flat-btn"
 397 |               target="_blank"
 398 |               rel="external nofollow noopener noreferrer">
 399 |             </a>
 400 |           
 401 |         
 402 |           
 403 |             <a href="https://github.com/JIAOBANTANG"
 404 |               class="social fab fa-github flat-btn"
 405 |               target="_blank"
 406 |               rel="external nofollow noopener noreferrer">
 407 |             </a>
 408 |           
 409 |         
 410 |           
 411 |             <a href="https://codepen.io/jiaobantang/pens/public/"
 412 |               class="social fab fa-codepen flat-btn"
 413 |               target="_blank"
 414 |               rel="external nofollow noopener noreferrer">
 415 |             </a>
 416 |           
 417 |         
 418 |           
 419 |             <a href="https://music.163.com/#/user/home?id=65219633"
 420 |               class="social fas fa-headphones-alt flat-btn"
 421 |               target="_blank"
 422 |               rel="external nofollow noopener noreferrer">
 423 |             </a>
 424 |           
 425 |         
 426 |       </div>
 427 |     
 428 |   </div>
 429 | </section>
 430 | 
 431 |             
 432 |           
 433 |         
 434 |           
 435 |           
 436 |         
 437 |           
 438 |           
 439 |         
 440 |           
 441 |           
 442 |         
 443 |           
 444 |           
 445 |         
 446 |           
 447 |           
 448 |         
 449 |       
 450 |         
 451 |           
 452 |           
 453 |         
 454 |           
 455 |           
 456 |         
 457 |           
 458 |           
 459 |         
 460 |           
 461 |           
 462 |         
 463 |           
 464 |           
 465 |         
 466 |           
 467 |           
 468 |             
 469 |               <section class='widget list'>
 470 |   
 471 | <header class='pure'>
 472 |   <div><i class="fas fa-thumbs-up fa-fw" aria-hidden="true"></i>&nbsp;&nbsp;强烈推荐</div>
 473 |   
 474 | </header>
 475 | 
 476 |   <div class='content pure'>
 477 |     <ul class="entry">
 478 |       
 479 |         <li><a class="flat-box" title="/2019/06/09/photo-map/" href="/2019/06/09/photo-map/"
 480 |           
 481 |           
 482 |           >
 483 |           <div class='name'>
 484 |             
 485 |               <i class=" fa-fw" aria-hidden="true"></i>
 486 |             
 487 |             &nbsp;&nbsp;地图相册
 488 |           </div>
 489 |           
 490 |         </a></li>
 491 |       
 492 |     </ul>
 493 |   </div>
 494 | </section>
 495 | 
 496 |             
 497 |           
 498 |         
 499 |       
 500 |         
 501 |           
 502 |           
 503 |         
 504 |           
 505 |           
 506 |         
 507 |           
 508 |           
 509 |             
 510 |               <section class='widget grid'>
 511 |   
 512 | <header class='pure'>
 513 |   <div><i class="fas fa-map-signs fa-fw" aria-hidden="true"></i>&nbsp;&nbsp;站内导航</div>
 514 |   
 515 | </header>
 516 | 
 517 |   <div class='content pure'>
 518 |     <ul class="grid navgation">
 519 |       
 520 |         <li><a class="flat-box" title="/" href="/"
 521 |           
 522 |           
 523 |           id="home">
 524 |           
 525 |             <i class="fas fa-clock fa-fw" aria-hidden="true"></i>
 526 |           
 527 |           近期文章
 528 |         </a></li>
 529 |       
 530 |         <li><a class="flat-box" title="/archives/" href="/archives/"
 531 |           
 532 |             rel="nofollow"
 533 |           
 534 |           
 535 |           id="archives">
 536 |           
 537 |             <i class="fas fa-archive fa-fw" aria-hidden="true"></i>
 538 |           
 539 |           文章归档
 540 |         </a></li>
 541 |       
 542 |         <li><a class="flat-box" title="/projects/" href="/projects/"
 543 |           
 544 |           
 545 |           id="projects">
 546 |           
 547 |             <i class="fas fa-code-branch fa-fw" aria-hidden="true"></i>
 548 |           
 549 |           开源项目
 550 |         </a></li>
 551 |       
 552 |         <li><a class="flat-box" title="/friends/" href="/friends/"
 553 |           
 554 |             rel="nofollow"
 555 |           
 556 |           
 557 |           id="friends">
 558 |           
 559 |             <i class="fas fa-link fa-fw" aria-hidden="true"></i>
 560 |           
 561 |           我的友链
 562 |         </a></li>
 563 |       
 564 |         <li><a class="flat-box" title="/about/" href="/about/"
 565 |           
 566 |             rel="nofollow"
 567 |           
 568 |           
 569 |           id="about">
 570 |           
 571 |             <i class="fas fa-info-circle fa-fw" aria-hidden="true"></i>
 572 |           
 573 |           关于小站
 574 |         </a></li>
 575 |       
 576 |     </ul>
 577 |   </div>
 578 | </section>
 579 | 
 580 |             
 581 |           
 582 |         
 583 |           
 584 |           
 585 |         
 586 |           
 587 |           
 588 |         
 589 |           
 590 |           
 591 |         
 592 |       
 593 |         
 594 |           
 595 |           
 596 |         
 597 |           
 598 |           
 599 |         
 600 |           
 601 |           
 602 |         
 603 |           
 604 |           
 605 |             
 606 |               
 607 |   <section class='widget category'>
 608 |     
 609 | <header class='pure'>
 610 |   <div><i class="fas fa-folder-open fa-fw" aria-hidden="true"></i>&nbsp;&nbsp;文章分类</div>
 611 |   
 612 |     <a class="rightBtn"
 613 |     
 614 |       rel="nofollow"
 615 |     
 616 |     
 617 |     href="/blog/categories/"
 618 |     title="blog/categories/">
 619 |     <i class="fas fa-expand-arrows-alt fa-fw"></i></a>
 620 |   
 621 | </header>
 622 | 
 623 |     <div class='content pure'>
 624 |       <ul class="entry">
 625 |         
 626 |           <li><a class="flat-box" title="/categories/Coding/" href="/categories/Coding/"><div class='name'>Coding</div><div class='badge'>(19)</div></a></li>
 627 |         
 628 |           <li><a class="flat-box child" title="/categories/Coding/Design/" href="/categories/Coding/Design/"><div class='name'>Design</div><div class='badge'>(1)</div></a></li>
 629 |         
 630 |           <li><a class="flat-box child" title="/categories/Coding/Docker/" href="/categories/Coding/Docker/"><div class='name'>Docker</div><div class='badge'>(5)</div></a></li>
 631 |         
 632 |           <li><a class="flat-box child" title="/categories/Coding/JS/" href="/categories/Coding/JS/"><div class='name'>JS</div><div class='badge'>(1)</div></a></li>
 633 |         
 634 |           <li><a class="flat-box child" title="/categories/Coding/MySQL/" href="/categories/Coding/MySQL/"><div class='name'>MySQL</div><div class='badge'>(3)</div></a></li>
 635 |         
 636 |           <li><a class="flat-box child" title="/categories/Coding/PHP/" href="/categories/Coding/PHP/"><div class='name'>PHP</div><div class='badge'>(2)</div></a></li>
 637 |         
 638 |           <li><a class="flat-box child" title="/categories/Coding/PSR/" href="/categories/Coding/PSR/"><div class='name'>PSR</div><div class='badge'>(1)</div></a></li>
 639 |         
 640 |           <li><a class="flat-box child" title="/categories/Coding/Swoole/" href="/categories/Coding/Swoole/"><div class='name'>Swoole</div><div class='badge'>(1)</div></a></li>
 641 |         
 642 |           <li><a class="flat-box child" title="/categories/Coding/Web/" href="/categories/Coding/Web/"><div class='name'>Web</div><div class='badge'>(3)</div></a></li>
 643 |         
 644 |           <li><a class="flat-box" title="/categories/PHP/" href="/categories/PHP/"><div class='name'>PHP</div><div class='badge'>(1)</div></a></li>
 645 |         
 646 |           <li><a class="flat-box" title="/categories/Self/" href="/categories/Self/"><div class='name'>Self</div><div class='badge'>(1)</div></a></li>
 647 |         
 648 |           <li><a class="flat-box" title="/categories/%E8%A1%80%E5%B0%8F%E6%9D%BF/" href="/categories/%E8%A1%80%E5%B0%8F%E6%9D%BF/"><div class='name'>血小板</div><div class='badge'>(1)</div></a></li>
 649 |         
 650 |       </ul>
 651 |     </div>
 652 |   </section>
 653 | 
 654 | 
 655 |             
 656 |           
 657 |         
 658 |           
 659 |           
 660 |         
 661 |           
 662 |           
 663 |         
 664 |       
 665 |         
 666 |           
 667 |           
 668 |         
 669 |           
 670 |           
 671 |         
 672 |           
 673 |           
 674 |         
 675 |           
 676 |           
 677 |         
 678 |           
 679 |           
 680 |             
 681 |               
 682 |   <section class='widget tagcloud'>
 683 |     
 684 | <header class='pure'>
 685 |   <div><i class="fas fa-tags fa-fw" aria-hidden="true"></i>&nbsp;&nbsp;热门标签</div>
 686 |   
 687 |     <a class="rightBtn"
 688 |     
 689 |       rel="nofollow"
 690 |     
 691 |     
 692 |     href="/blog/tags/"
 693 |     title="blog/tags/">
 694 |     <i class="fas fa-expand-arrows-alt fa-fw"></i></a>
 695 |   
 696 | </header>
 697 | 
 698 |     <div class='content pure'>
 699 |       <a href="/tags/Coding/" style="font-size: 20.67px; color: #6c6c6c">Coding</a> <a href="/tags/Cool/" style="font-size: 14px; color: #999">Cool</a> <a href="/tags/JavaScript/" style="font-size: 14px; color: #999">JavaScript</a> <a href="/tags/MySQL/" style="font-size: 17.33px; color: #828282">MySQL</a> <a href="/tags/OOP/" style="font-size: 14px; color: #999">OOP</a> <a href="/tags/PDO/" style="font-size: 14px; color: #999">PDO</a> <a href="/tags/PHP/" style="font-size: 14px; color: #999">PHP</a> <a href="/tags/Swoole/" style="font-size: 14px; color: #999">Swoole</a> <a href="/tags/docker/" style="font-size: 24px; color: #555">docker</a> <a href="/tags/live2D/" style="font-size: 14px; color: #999">live2D</a> <a href="/tags/nginx/" style="font-size: 14px; color: #999">nginx</a> <a href="/tags/php/" style="font-size: 14px; color: #999">php</a> <a href="/tags/snowflake/" style="font-size: 14px; color: #999">snowflake</a> <a href="/tags/%E5%9C%B0%E5%9B%BE%E7%9B%B8%E5%86%8C/" style="font-size: 14px; color: #999">地图相册</a> <a href="/tags/%E6%8E%A5%E5%8F%A3%E5%BC%80%E5%8F%91/" style="font-size: 14px; color: #999">接口开发</a> <a href="/tags/%E6%94%B9%E5%8F%98/" style="font-size: 14px; color: #999">改变</a> <a href="/tags/%E6%97%A5%E7%AD%BE/" style="font-size: 14px; color: #999">日签</a> <a href="/tags/%E6%9C%8D%E5%8A%A1%E7%AB%AF/" style="font-size: 14px; color: #999">服务端</a> <a href="/tags/%E7%B3%96%E7%B3%96%E6%97%A5%E7%AD%BE/" style="font-size: 14px; color: #999">糖糖日签</a> <a href="/tags/%E8%87%AA%E6%88%91%E5%8F%91%E5%B1%95/" style="font-size: 14px; color: #999">自我发展</a> <a href="/tags/%E8%A1%80%E5%B0%8F%E6%9D%BF/" style="font-size: 14px; color: #999">血小板</a> <a href="/tags/%E8%AE%BE%E8%AE%A1%E6%A8%A1%E5%BC%8F/" style="font-size: 14px; color: #999">设计模式</a>
 700 |     </div>
 701 |   </section>
 702 | 
 703 | 
 704 |             
 705 |           
 706 |         
 707 |           
 708 |           
 709 |         
 710 |       
 711 |     
 712 | 
 713 |   
 714 | </aside>
 715 | 
 716 | <footer id="footer" class="clearfix">
 717 |   
 718 |   
 719 |     <div class="social-wrapper">
 720 |       
 721 |         
 722 |           <a href="/mailto:847280718@qq.com"
 723 |             class="social fas fa-envelope flat-btn"
 724 |             target="_blank"
 725 |             rel="external nofollow noopener noreferrer">
 726 |           </a>
 727 |         
 728 |       
 729 |         
 730 |           <a href="https://github.com/JIAOBANTANG"
 731 |             class="social fab fa-github flat-btn"
 732 |             target="_blank"
 733 |             rel="external nofollow noopener noreferrer">
 734 |           </a>
 735 |         
 736 |       
 737 |         
 738 |           <a href="https://codepen.io/jiaobantang/pens/public/"
 739 |             class="social fab fa-codepen flat-btn"
 740 |             target="_blank"
 741 |             rel="external nofollow noopener noreferrer">
 742 |           </a>
 743 |         
 744 |       
 745 |         
 746 |           <a href="https://music.163.com/#/user/home?id=65219633"
 747 |             class="social fas fa-headphones-alt flat-btn"
 748 |             target="_blank"
 749 |             rel="external nofollow noopener noreferrer">
 750 |           </a>
 751 |         
 752 |       
 753 |     </div>
 754 |   
 755 |   <br>
 756 |   <div>
 757 |     <div class="footer">
 758 |       <p><span style="color:rgb(61, 197, 80);">种一棵树最好的时间是十年前，其次是现在</span></p>
 759 | 
 760 |     </div>
 761 | 
 762 |   </div>
 763 |   <!-- <div><p>Blog content follows the <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/deed.en" target="_blank" rel="noopener">Attribution-NonCommercial-ShareAlike 4.0 International (CC BY-NC-SA 4.0) License</a></p>
 764 | </div> -->
 765 |   <div>
 766 |     本站使用
 767 |     <a href="https://xaoxuu.com/wiki/material-x/" target="_blank" class="codename">Material X</a>
 768 |     作为主题
 769 |     
 770 |       ，
 771 |       总访问量为
 772 |       <span id="busuanzi_value_site_pv"><i class="fas fa-spinner fa-spin fa-fw" aria-hidden="true"></i></span>
 773 |       次
 774 |     
 775 |     。
 776 |   </div>
 777 |   <div id="sitetime"></div>
 778 | </footer>
 779 | <script>setLoadingBarProgress(80);</script>
 780 | <script src="https://cdn.bootcss.com/jquery/3.3.0/jquery.min.js"></script>
 781 | <!-- 血小板 -->
 782 | <div id="landlord">
 783 |   <div class="message" style="opacity:0"></div>
 784 |   <canvas id="live2d" width="560" height="500" class="live2d"></canvas>
 785 |   <div class="hide-button">隐藏</div>
 786 | </div>
 787 | <!-- 血小板-->
 788 | <script type="text/javascript">
 789 |   var message_Path = '/live2d/'
 790 | </script>
 791 | <script type="text/javascript" src="/live2d/js/live2d.js"></script>
 792 | <script type="text/javascript" src="/live2d/js/message.js"></script>
 793 | <script type="text/javascript">
 794 |   loadlive2d("live2d", "/live2d/model/xiaoban/model.json");
 795 | </script>
 796 | <!-- 点击特效，输入特效 运行时间 -->
 797 | <script type="text/javascript" src="/cool/cooltext.js"></script>
 798 | <script type="text/javascript" src="/cool/clicklove.js"></script>
 799 | <script type="text/javascript" src="/cool/sitetime.js"></script>
 800 | <script type="text/javascript" src="/cool/banner.js"></script>
 801 | 
 802 | 
 803 |       <script>setLoadingBarProgress(60);</script>
 804 |     </div>
 805 |     <a class="s-top fas fa-arrow-up fa-fw" href='javascript:void(0)' target="_blank" rel="noopener"></a>
 806 |   </div>
 807 |   <script src="https://cdn.jsdelivr.net/npm/jquery@3.3.1/dist/jquery.min.js"></script>
 808 | 
 809 |   <script>
 810 |     var GOOGLE_CUSTOM_SEARCH_API_KEY = "";
 811 |     var GOOGLE_CUSTOM_SEARCH_ENGINE_ID = "";
 812 |     var ALGOLIA_API_KEY = "";
 813 |     var ALGOLIA_APP_ID = "";
 814 |     var ALGOLIA_INDEX_NAME = "";
 815 |     var AZURE_SERVICE_NAME = "";
 816 |     var AZURE_INDEX_NAME = "";
 817 |     var AZURE_QUERY_KEY = "";
 818 |     var BAIDU_API_ID = "";
 819 |     var SEARCH_SERVICE = "hexo" || "hexo";
 820 |     var ROOT = "/"||"/";
 821 |     if(!ROOT.endsWith('/'))ROOT += '/';
 822 |   </script>
 823 | 
 824 | <script src="//instant.page/1.2.2" type="module" integrity="sha384-2xV8M5griQmzyiY3CDqh1dn4z3llDVqZDqzjzcY+jCBCk/a5fXJmuZ/40JJAPeoU"></script>
 825 | 
 826 | 
 827 |   <script async src="https://cdn.jsdelivr.net/npm/scrollreveal@4.0.5/dist/scrollreveal.min.js"></script>
 828 |   <script type="text/javascript">
 829 |     $(function() {
 830 |       const $reveal = $('.reveal');
 831 |       if ($reveal.length === 0) return;
 832 |       const sr = ScrollReveal({ distance: 0 });
 833 |       sr.reveal('.reveal');
 834 |     });
 835 |   </script>
 836 | 
 837 | 
 838 |   <script src="https://cdn.jsdelivr.net/npm/node-waves@0.7.6/dist/waves.min.js"></script>
 839 |   <script type="text/javascript">
 840 |     $(function() {
 841 |       Waves.attach('.flat-btn', ['waves-button']);
 842 |       Waves.attach('.float-btn', ['waves-button', 'waves-float']);
 843 |       Waves.attach('.float-btn-light', ['waves-button', 'waves-float', 'waves-light']);
 844 |       Waves.attach('.flat-box', ['waves-block']);
 845 |       Waves.attach('.float-box', ['waves-block', 'waves-float']);
 846 |       Waves.attach('.waves-image');
 847 |       Waves.init();
 848 |     });
 849 |   </script>
 850 | 
 851 | 
 852 |   <script async src="https://cdn.jsdelivr.net/gh/xaoxuu/cdn-busuanzi@2.3/js/busuanzi.pure.mini.js"></script>
 853 | 
 854 | 
 855 | 
 856 | 
 857 |   
 858 |   
 859 |   
 860 |     <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-backstretch/2.0.4/jquery.backstretch.min.js"></script>
 861 |     <script type="text/javascript">
 862 |       $(function(){
 863 |         if ('.cover') {
 864 |           $('.cover').backstretch(
 865 |           ["https://img.vim-cn.com/29/91197b04c13f512f734a76d4ac422d89dbe229.jpg"],
 866 |           {
 867 |             duration: "6000",
 868 |             fade: "2500"
 869 |           });
 870 |         } else {
 871 |           $.backstretch(
 872 |           ["https://img.vim-cn.com/29/91197b04c13f512f734a76d4ac422d89dbe229.jpg"],
 873 |           {
 874 |             duration: "6000",
 875 |             fade: "2500"
 876 |           });
 877 |         }
 878 |       });
 879 |     </script>
 880 |   
 881 | 
 882 | 
 883 | 
 884 | 
 885 | 
 886 | 
 887 | 
 888 | 
 889 | 
 890 | 
 891 | 
 892 |   <script src="https://cdn.jsdelivr.net/gh/xaoxuu/cdn-material-x@19.9/js/app.js"></script>
 893 | 
 894 | 
 895 |   <script src="https://cdn.jsdelivr.net/gh/xaoxuu/cdn-material-x@19.9/js/search.js"></script>
 896 | 
 897 | 
 898 | 
 899 | 
 900 | <!-- 复制 -->
 901 | <script src="https://cdn.jsdelivr.net/npm/clipboard@2/dist/clipboard.min.js"></script>
 902 | <script>
 903 |   let COPY_SUCCESS = "复制成功";
 904 |   let COPY_FAILURE = "复制失败";
 905 |   /*页面载入完成后，创建复制按钮*/
 906 |   !function (e, t, a) {
 907 |     /* code */
 908 |     var initCopyCode = function(){
 909 |       var copyHtml = '';
 910 |       copyHtml += '<button class="btn-copy" data-clipboard-snippet="">';
 911 |       copyHtml += '  <i class="fa fa-copy"></i><span>复制</span>';
 912 |       copyHtml += '</button>';
 913 |       $(".highlight .code pre").before(copyHtml);
 914 |       var clipboard = new ClipboardJS('.btn-copy', {
 915 |         target: function(trigger) {
 916 |           return trigger.nextElementSibling;
 917 |         }
 918 |       });
 919 | 
 920 |       clipboard.on('success', function(e) {
 921 |         //您可以加入成功提示
 922 |         console.info('Action:', e.action);
 923 |         console.info('Text:', e.text);
 924 |         console.info('Trigger:', e.trigger);
 925 |         success_prompt(COPY_SUCCESS);
 926 |         e.clearSelection();
 927 |       });
 928 |       clipboard.on('error', function(e) {
 929 |         //您可以加入失败提示
 930 |         console.error('Action:', e.action);
 931 |         console.error('Trigger:', e.trigger);
 932 |         fail_prompt(COPY_FAILURE);
 933 |       });
 934 |     }
 935 |     initCopyCode();
 936 | 
 937 |   }(window, document);
 938 | 
 939 |   /**
 940 |    * 弹出式提示框，默认1.5秒自动消失
 941 |    * @param message 提示信息
 942 |    * @param style 提示样式，有alert-success、alert-danger、alert-warning、alert-info
 943 |    * @param time 消失时间
 944 |    */
 945 |   var prompt = function (message, style, time)
 946 |   {
 947 |       style = (style === undefined) ? 'alert-success' : style;
 948 |       time = (time === undefined) ? 1500 : time*1000;
 949 |       $('<div>')
 950 |           .appendTo('body')
 951 |           .addClass('alert ' + style)
 952 |           .html(message)
 953 |           .show()
 954 |           .delay(time)
 955 |           .fadeOut();
 956 |   };
 957 | 
 958 |   // 成功提示
 959 |   var success_prompt = function(message, time)
 960 |   {
 961 |       prompt(message, 'alert-success', time);
 962 |   };
 963 | 
 964 |   // 失败提示
 965 |   var fail_prompt = function(message, time)
 966 |   {
 967 |       prompt(message, 'alert-danger', time);
 968 |   };
 969 | 
 970 |   // 提醒
 971 |   var warning_prompt = function(message, time)
 972 |   {
 973 |       prompt(message, 'alert-warning', time);
 974 |   };
 975 | 
 976 |   // 信息提示
 977 |   var info_prompt = function(message, time)
 978 |   {
 979 |       prompt(message, 'alert-info', time);
 980 |   };
 981 | 
 982 | </script>
 983 | 
 984 | 
 985 | <!-- fancybox -->
 986 | <script src="https://cdn.jsdelivr.net/gh/fancyapps/fancybox@3.5.7/dist/jquery.fancybox.min.js"></script>
 987 | <script>
 988 |   let LAZY_LOAD_IMAGE = "";
 989 |   $(".article-entry").find("fancybox").find("img").each(function () {
 990 |       var element = document.createElement("a");
 991 |       $(element).attr("data-fancybox", "gallery");
 992 |       $(element).attr("href", $(this).attr("src"));
 993 |       /* 图片采用懒加载处理时,
 994 |        * 一般图片标签内会有个属性名来存放图片的真实地址，比如 data-original,
 995 |        * 那么此处将原本的属性名src替换为对应属性名data-original,
 996 |        * 修改如下
 997 |        */
 998 |        if (LAZY_LOAD_IMAGE) {
 999 |          $(element).attr("href", $(this).attr("data-original"));
1000 |        }
1001 |       $(this).wrap(element);
1002 |   });
1003 | </script>
1004 | 
1005 | 
1006 | 
1007 | 
1008 | 
1009 |   <script>setLoadingBarProgress(100);</script>
1010 | </body>
1011 | </html>
1012 | 


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