-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
779 lines (573 loc) · 54.9 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
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
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
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
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
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
683
684
685
686
687
688
689
690
691
692
693
694
695
696
697
698
699
700
701
702
703
704
705
706
707
708
709
710
711
712
713
714
715
716
717
718
719
720
721
722
723
724
725
726
727
728
729
730
731
732
733
734
735
736
737
738
739
740
741
742
743
744
745
746
747
748
749
750
751
752
753
754
755
756
757
758
759
760
761
762
763
764
765
766
767
768
769
770
771
772
773
774
775
776
777
778
779
<!DOCTYPE html>
<html>
<head>
<script>window._bd_share_config={"common":{"bdSnsKey":{},"bdText":"","bdMini":"2","bdMiniList":false,"bdPic":"","bdStyle":"0","bdSize":"16"},"slide":{"type":"slide","bdImg":"6","bdPos":"right","bdTop":"110.5"},"image":{"viewList":["qzone","tsina","tqq","renren","weixin"],"viewText":"分享到：","viewSize":"16"},"selectShare":{"bdContainerClass":null,"bdSelectMiniList":["qzone","tsina","tqq","renren","weixin"]}};with(document)0[(getElementsByTagName('head')[0]||body).appendChild(createElement('script')).src='http://bdimg.share.baidu.com/static/api/js/share.js?v=89860593.js?cdnversion='+~(-new Date()/36e5)];</script>
<meta charset="utf-8">
<title>李仕臣的博客</title>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<meta name="description" content="李仕臣的博客">
<meta property="og:type" content="website">
<meta property="og:title" content="李仕臣的博客">
<meta property="og:url" content="http://SunOfHomeBoy.github.io/index.html">
<meta property="og:site_name" content="李仕臣的博客">
<meta property="og:description" content="李仕臣的博客">
<meta property="og:locale" content="zh-CN">
<meta name="twitter:card" content="summary">
<meta name="twitter:title" content="李仕臣的博客">
<meta name="twitter:description" content="李仕臣的博客">
<link rel="alternate" href="/atom.xml" title="李仕臣的博客" type="application/atom+xml">
<link rel="icon" href="/favicon.png">
<link href="//fonts.googleapis.com/css?family=Source+Code+Pro" rel="stylesheet" type="text/css">
<link rel="stylesheet" href="/css/style.css">
<link rel="stylesheet" href="/plugin/bganimation/bg.css">
</head>
<body>
<div id="container">
<div id="wrap">
<div class="outer">
<div class="widget-wrap mobile-header">
<h3 class="widget-title"></h3>
<div class="widget">
<img class="avatar" src="https://avatars2.githubusercontent.com/u/30047595?s=460&v=4">
<h2 class="author">李仕臣</h2>
<h3 class="description">李仕臣的博客</h3>
<div class="count-box">
<a href="/archives"><div><strong>183</strong><br>文章</div></a>
<a href="/categories"><div><strong>87</strong><br>分类</div></a>
<a href="/tags"><div><strong>136</strong><br>标签</div></a>
</div>
<ul class="blog-link">
<a href="/" title="Home">
<li>主页</li>
</a>
<a href="/archives" title="Archives">
<li>归档</li>
</a>
<a href="/categories" title="Categories">
<li>分类</li>
</a>
<a href="/tags" title="Tags">
<li>标签</li>
</a>
</ul>
</div>
</div>
<section id="main">
<article id="post-关于GIS" class="wow slideInRight article article-type-post" itemscope itemprop="blogPost">
<div class="article-meta">
<a href="/2019/09/24/关于GIS/" class="article-date">
<time class="post-time" datetime="2019-09-24T03:22:16.000Z" itemprop="datePublished">
<span class="post-month">9月</span><br/>
<span class="post-day">24</span>
</time>
</a>
</div>
<div class="article-inner">
<header class="article-header">
<h1 itemprop="name">
<a class="article-title" href="/2019/09/24/关于GIS/">关于GIS</a>
</h1>
<div>
|
<div class="view-box">
<span id="/2019/09/24/关于GIS/" class="leancloud_visitors" data-flag-title="关于GIS">
阅读次数<span class="leancloud-visitors-count"></span>
</span>
</div>
</div>
</header>
<div class="article-entry" itemprop="articleBody">
<h2 id="关于地图数据服务和地图引擎服务，权威解读"><a href="#关于地图数据服务和地图引擎服务，权威解读" class="headerlink" title="关于地图数据服务和地图引擎服务，权威解读"></a>关于地图数据服务和地图引擎服务，权威解读</h2><p><strong>地图服务至少包括两部分内容：</strong></p>
<ul>
<li><p>一是地图数据服务。</p>
<p>考虑到安全性，国家对这一块是严令禁止的，这一块需要有国家测绘资质的企业去采集，如果没有测绘资质的去采集是违法的，如果没有测绘资质的企业要用地图数据，这些企业可以去向有资质的企业采购（一般是四维或者高德），并且地图必须是测绘局审批过有审图号的数据；普通图商购买这些数据后，和自己的地图引擎一起进行售卖。试用阶段，图商提供的地图数据都是非法过期数据。</p>
</li>
<li><p>二是地图引擎服务。</p>
<p>这个是把数据进行管理，包括图层管理、渲染、路径规划等基本功能，这些工具有ESRI公司的Arcgis系列以及超图的软件、公安行业还有一家叫山海经纬的公司做的PGIS也是地图引擎。但是，以上任何一家，都是很大的团队、花费至少十几二十年以上时间在做这个，这个不是几个人的团队在短时间内做的了的。</p>
</li>
</ul>
</div>
<footer class="article-footer">
<a data-url="http://SunOfHomeBoy.github.io/2019/09/24/关于GIS/" data-id="ck1t2f63z000yrcduzb1q6h35" class="article-share-link">分享</a>
</footer>
</div>
</article>
<article id="post-程序员30岁后" class="wow slideInRight article article-type-post" itemscope itemprop="blogPost">
<div class="article-meta">
<a href="/2019/09/18/程序员30岁后/" class="article-date">
<time class="post-time" datetime="2019-09-18T10:47:45.000Z" itemprop="datePublished">
<span class="post-month">9月</span><br/>
<span class="post-day">18</span>
</time>
</a>
</div>
<div class="article-inner">
<header class="article-header">
<h1 itemprop="name">
<a class="article-title" href="/2019/09/18/程序员30岁后/">程序员30岁后的 20 条人生建议</a>
</h1>
<div>
|
<div class="view-box">
<span id="/2019/09/18/程序员30岁后/" class="leancloud_visitors" data-flag-title="程序员30岁后的 20 条人生建议">
阅读次数<span class="leancloud-visitors-count"></span>
</span>
</div>
</div>
</header>
<div class="article-entry" itemprop="articleBody">
<h2 id="程序员，活得是本事：30-岁后的-20-条人生建议"><a href="#程序员，活得是本事：30-岁后的-20-条人生建议" class="headerlink" title="程序员，活得是本事：30 岁后的 20 条人生建议"></a>程序员，活得是本事：30 岁后的 20 条人生建议</h2><p>一个程序员看待职业的方式，决定了他能走多远。</p>
<p>有的人把职业当游戏，不论 buff 还是 bug 都要闯过去；有的人把职业当对手，不是一心想赢，只是不想输；有的人，活得是造型；有的人，活得是人设；程序员，活得是本事。</p>
<p>今天，我们采访了 10 多位程序员，并将他们的经验整理成这篇《程序员的 20 条职业感悟》。</p>
<h2 id="01-关于-Work-life-balance"><a href="#01-关于-Work-life-balance" class="headerlink" title="01 关于 Work life balance"></a>01 关于 Work life balance</h2><p>❶ 把身体锻炼好，只要你有一个<code>健康的身体</code>和健康的生活观，这个世界就饿不死人。</p>
<p>❷ 最好能够做到<code>早起</code>，一方面早上人的头脑比较清晰，另一方面可以在没有人打扰的时间里多学点东西。</p>
<p>❸ 自己的发展路线应该是<code>最大限度地加强和发挥自己独特的组合</code>，而不是<code>寻求单项的超越</code>。主要是通过实践，其次是要有意识地构造。</p>
<p>❹ 学习的能力和阅读的习惯，是从大学毕业后最该带到工作里的两样东西。</p>
<p>❺ 不要做个纯码农，多抽空做点<code>其他自己感兴趣</code>的事情。</p>
<h2 id="02-关于技术"><a href="#02-关于技术" class="headerlink" title="02 关于技术"></a>02 关于技术</h2><p>❶ 编程是一件需要技术积累的工作。涉及的不仅仅是写程序，还有对系统的了解，对工具的熟悉，<code>工作方法，经验</code>很重要。</p>
<p>❷ 学习新技术的时候多看“官方文档”。编写文档的人群，通常就是这些技术或者软件的开发者，他们是对这些东西最了解的人。因此，官方文档质量是很高的，通常也是最新的。</p>
<p>❸ 把觉得不靠谱的需求放到最后做，也许到时候需求就变了。</p>
<p>❹ 宁愿终止程序也不要带着错误运行下去。</p>
<p>❺ 隔一段时间就回去看看自己几个月之前写的代码，这能够让你认识到代码的可读性有多重要，亲身体会才能懂得。</p>
<p>❻ 程序不等于数据结构加算法，而等于搜索引擎加英语。</p>
<h2 id="03-关于年龄"><a href="#03-关于年龄" class="headerlink" title="03 关于年龄"></a>03 关于年龄</h2><p>❶ 所谓的年龄歧视是在<code>给自己设定心理障碍</code>，你真正应该担心的不是年龄，在于你是否有<code>职业规划</code>，是否朝职业目标努力，你的年龄是否达到了<code>相应的能力及经验</code>。</p>
<p>❷ 如果你坚持<code>持续学习</code>，不管在哪一个行业都会<code>越老越香</code>的。</p>
<p>❸ 无论年龄多大，需要学习的东西有很多，在专业的道路上还是要继续尝试做技术创新。</p>
<p>❹ 条条大路通罗马，选择一个自己热爱的行业很重要。</p>
<h2 id="04-关于情商"><a href="#04-关于情商" class="headerlink" title="04 关于情商"></a>04 关于情商</h2><p>❶ <code>心要皮实，但话语和脸皮要柔软</code>，记住有句老话叫，<code>伸手不打笑脸人</code>。</p>
<p>❷ 编码的时候只思考同一个思维层次的逻辑，在这层完成之后再思考下一层。</p>
<p>❸ 千万别真的认为别人都是傻逼，否则会降低你的可合作性，可合作性在团队里是项很重要的能力。</p>
<p>❹ 真正的领导能力不是令人服从，而是让大家用正确高效的方法完成任务。</p>
<p>❺ 永远别小看程序媛。</p>
<h2 id="对了，还有一条最重要的感悟是几位程序员共同提到的"><a href="#对了，还有一条最重要的感悟是几位程序员共同提到的" class="headerlink" title="对了，还有一条最重要的感悟是几位程序员共同提到的"></a>对了，还有一条最重要的感悟是几位程序员共同提到的</h2><ul>
<li><p>一定要记录自己的技术积累, 才能获得技术的提升,不论是写文章还是做分享. <code>或许你资历尚浅，技术思路和技术方向还很难摸清</code>。这时<code>学习与模仿</code>对你来说至关重要，学习别人思考问题的角度，分析成熟的技术文章的知识脉络。</p>
</li>
<li><p>这样做的意义在于：</p>
<ul>
<li>从自身学习出发：从别人的思路里看到自己的技术边界，找到一个方向学习；</li>
<li>从业务方向出发：看看别人输出成熟的技术实践，帮助你解决业务难题</li>
</ul>
</li>
</ul>
<p>GitChat 上技术达人、技术大佬的那些高质量文章，总有一篇能够戳中当下现状的你，汲取他们的技术经验和技术思想，应用在自己的学习与项目中。</p>
<p>比如：</p>
<p>58沈剑的系列 Chat 文章</p>
<p>《数据库典型架构实践》<br>《从用户中心开始，聊“单KEY”类业务数据库水平切分架构实践》<br>《从帖子中心开始，聊“1对多”类业务数据库水平切分架构实践》<br>《从好友关系开始，聊“多对多”类业务数据库水平切分架构实践<br>《从订单中心开始，聊“多KEY”类业务数据库水平切分架构实践》<br>《除了水平切分，数据库架构设计还经常遇到哪些问题》</p>
<p>左耳朵耗子的 Chat 文章</p>
<p>《左耳朵谈个人成长：做正确的事，等着被开除》</p>
<p>狼叔的 Chat 文章</p>
<p>《深入浅出浏览器渲染原理》</p>
</div>
<footer class="article-footer">
<a data-url="http://SunOfHomeBoy.github.io/2019/09/18/程序员30岁后/" data-id="ck1t2f65i001yrcduwrvqurq0" class="article-share-link">分享</a>
</footer>
</div>
</article>
<article id="post-FrontEnd/HTML CSS/CSS-自定义Input-type-radio-样式" class="wow slideInRight article article-type-post" itemscope itemprop="blogPost">
<div class="article-meta">
<a href="/2019/09/12/FrontEnd/HTML CSS/CSS-自定义Input-type-radio-样式/" class="article-date">
<time class="post-time" datetime="2019-09-12T02:32:06.000Z" itemprop="datePublished">
<span class="post-month">9月</span><br/>
<span class="post-day">12</span>
</time>
</a>
</div>
<div class="article-inner">
<header class="article-header">
<h1 itemprop="name">
<a class="article-title" href="/2019/09/12/FrontEnd/HTML CSS/CSS-自定义Input-type-radio-样式/">CSS-自定义Input[type=radio]样式</a>
</h1>
<div>
<div class="article-category">
<a class="article-category-link" href="/categories/HTML-CSS/">HTML+CSS</a>
</div>
|
<div class="view-box">
<span id="/2019/09/12/FrontEnd/HTML CSS/CSS-自定义Input-type-radio-样式/" class="leancloud_visitors" data-flag-title="CSS-自定义Input[type=radio]样式">
阅读次数<span class="leancloud-visitors-count"></span>
</span>
</div>
</div>
</header>
<div class="article-entry" itemprop="articleBody">
<p><a href="https://www.cnblogs.com/xinjie-just/p/5911086.html" target="_blank" rel="noopener">伪类 :checkbox 实现</a></p>
<figure class="highlight html"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br></pre></td><td class="code"><pre><span class="line"><span class="tag"><<span class="name">div</span> <span class="attr">class</span>=<span class="string">"female"</span>></span></span><br><span class="line"> <span class="tag"><<span class="name">input</span> <span class="attr">type</span>=<span class="string">"radio"</span> <span class="attr">id</span>=<span class="string">"female"</span> <span class="attr">name</span>=<span class="string">"sex"</span> /></span></span><br><span class="line"> <span class="tag"><<span class="name">label</span> <span class="attr">for</span>=<span class="string">"female"</span>></span>女<span class="tag"></<span class="name">label</span>></span></span><br><span class="line"><span class="tag"></<span class="name">div</span>></span></span><br><span class="line"><span class="tag"><<span class="name">div</span> <span class="attr">class</span>=<span class="string">"male"</span>></span> </span><br><span class="line"> <span class="tag"><<span class="name">input</span> <span class="attr">type</span>=<span class="string">"radio"</span> <span class="attr">id</span>=<span class="string">"male"</span> <span class="attr">name</span>=<span class="string">"sex"</span> /></span></span><br><span class="line"> <span class="tag"><<span class="name">label</span> <span class="attr">for</span>=<span class="string">"male"</span>></span>男<span class="tag"></<span class="name">label</span>></span></span><br><span class="line"><span class="tag"></<span class="name">div</span>></span></span><br></pre></td></tr></table></figure>
<figure class="highlight css"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment">/* 未选中 */</span></span><br><span class="line"><span class="selector-tag">input</span><span class="selector-attr">[type="radio"]</span> + <span class="selector-tag">label</span><span class="selector-pseudo">::before</span> {</span><br><span class="line"> <span class="attribute">content</span>: <span class="string">"\a0"</span>; <span class="comment">/*不换行空格*/</span></span><br><span class="line"> <span class="attribute">display</span>: inline-block;</span><br><span class="line"> <span class="attribute">box-sizing</span>: border-box;</span><br><span class="line"> <span class="attribute">width</span>: <span class="number">1em</span>;</span><br><span class="line"> <span class="attribute">height</span>: <span class="number">1em</span>;</span><br><span class="line"> <span class="attribute">margin-right</span>: .<span class="number">4em</span>;</span><br><span class="line"> <span class="attribute">font-size</span>: <span class="number">18px</span>;</span><br><span class="line"> <span class="attribute">line-height</span>: <span class="number">1</span>; </span><br><span class="line"> <span class="attribute">text-indent</span>: .<span class="number">15em</span>;</span><br><span class="line"> <span class="attribute">vertical-align</span>: middle;</span><br><span class="line"> <span class="attribute">border-radius</span>: <span class="number">50%</span>;</span><br><span class="line"> <span class="attribute">border</span>: <span class="number">1px</span> solid <span class="number">#01cd78</span>;</span><br><span class="line">}</span><br><span class="line"></span><br><span class="line"><span class="comment">/* 选中 */</span></span><br><span class="line"><span class="selector-tag">input</span><span class="selector-attr">[type="radio"]</span><span class="selector-pseudo">:checked</span> + <span class="selector-tag">label</span><span class="selector-pseudo">::before</span> {</span><br><span class="line"> <span class="attribute">background-color</span>: <span class="number">#01cd78</span>;</span><br><span class="line"> <span class="attribute">background-clip</span>: content-box;</span><br><span class="line"> <span class="attribute">padding</span>: .<span class="number">2em</span>;</span><br><span class="line">}</span><br><span class="line"></span><br><span class="line"><span class="comment">/* 隐藏原来选中框 */</span></span><br><span class="line"><span class="selector-tag">input</span><span class="selector-attr">[type="radio"]</span> {</span><br><span class="line"> <span class="attribute">position</span>: absolute;</span><br><span class="line"> <span class="attribute">clip</span>: <span class="built_in">rect</span>(0, 0, 0, 0);</span><br><span class="line">}</span><br></pre></td></tr></table></figure>
<p>隐藏原来的单选按钮时，如果使用 <code>display: none;</code>，那样会把它从键盘 tab 键切换焦点的队列中完全删除。</p>
<p>于是可采用剪切的方式，让剪切后的尺寸为零，这样就隐藏了原来的单选按钮。</p>
</div>
<footer class="article-footer">
<a data-url="http://SunOfHomeBoy.github.io/2019/09/12/FrontEnd/HTML CSS/CSS-自定义Input-type-radio-样式/" data-id="ck1t2f6je0099rcdune4mn9vr" class="article-share-link">分享</a>
<ul class="article-tag-list"><li class="article-tag-list-item"><a class="article-tag-list-link" href="/tags/Input-radio/">Input radio</a></li></ul>
</footer>
</div>
</article>
<article id="post-游戏-恋爱" class="wow slideInRight article article-type-post" itemscope itemprop="blogPost">
<div class="article-meta">
<a href="/2019/08/21/游戏-恋爱/" class="article-date">
<time class="post-time" datetime="2019-08-21T02:00:19.000Z" itemprop="datePublished">
<span class="post-month">8月</span><br/>
<span class="post-day">21</span>
</time>
</a>
</div>
<div class="article-inner">
<header class="article-header">
<h1 itemprop="name">
<a class="article-title" href="/2019/08/21/游戏-恋爱/">为什么现在很多男生宁愿打游戏，也不愿去追女生？</a>
</h1>
<div>
<div class="article-category">
<a class="article-category-link" href="/categories/生活/">生活</a>
</div>
|
<div class="view-box">
<span id="/2019/08/21/游戏-恋爱/" class="leancloud_visitors" data-flag-title="为什么现在很多男生宁愿打游戏，也不愿去追女生？">
阅读次数<span class="leancloud-visitors-count"></span>
</span>
</div>
</div>
</header>
<div class="article-entry" itemprop="articleBody">
<h1 id="为什么现在很多男生宁愿打游戏，也不愿去追女生？"><a href="#为什么现在很多男生宁愿打游戏，也不愿去追女生？" class="headerlink" title="为什么现在很多男生宁愿打游戏，也不愿去追女生？"></a>为什么现在很多男生宁愿打游戏，也不愿去追女生？</h1><ul>
<li><p>1.男性在恋爱中的经济成本过高。这一点可能会让知乎上经济独立的女生觉得委屈，但先别急，我们接着往下说。在两性相处中，有一个水很深的概念，叫“动态AA”。所谓“动态AA”，就是两人约会开销不由某一方承担，但也不刻意平均。举个例子就是：你请我看电影，我请你喝奶茶；或者“你送我礼物，我也会回送。”这在知乎上几乎是政治正确，在现实中确实也有许多女生如此实行。乍一看，这是女生自我价值的觉醒与对男性的体贴，但仔细观察就会发现，这其中其实存在许多猫腻：<br><strong>男生总是承担大宗消费</strong>。在恋爱中，甚至可能出现8：2的男女出资比例。</p>
<p>男生常年请吃饭成了女生口中“并没花什么实质的钱”。在此处有个词“dinner whore”，感兴趣的朋友可以自行查阅。有的女生吃饭从来不付钱，钱，但是会送男朋友礼物，而且还挺大方。一谈到男女在恋爱中的花销，她们可以说“我送了你这个，我送了你那个”，男生也只不过送了类似价值的礼物而已，似乎她们达到了“新时代独立自主女性”的要求。但是有会计常识的人，都能看出来，一年就算送几次比较贵重的礼物，也不过几千块，但是常年请吃饭，在上海得好几万。</p>
<p>拼着把钱花光。这是一种看似平等其实很不平等的做法。有的女生吃饭愿意AA，收礼也愿意回礼，但是她们喜欢把个人月光的生活方式带到恋爱关系中。于是两个年轻人一起拼着消费，出入高档餐厅，打卡网红餐厅，到处旅游，互相送贵重的礼物。几年恋爱谈下来，两个都成了月光族。但是这种女生在结婚方面的硬性物质要求一点都不会降低，房子还是要的，车子也是必须的。所以这种高消费的恋爱关系最终会结束，女生潸然泪下，“跟你在一起这些年真的很开心”，“再也找不到对我更好的人了”，然后嫁给了一个物质条件更好的男人。如果两个人在一起的前提必须是降低男生自己的生活质量，那么恋爱对于男生来说又能有多大的吸引力呢？</p>
</li>
<li><p>2.舔狗之殇，谁的痛？这个时代不浪漫到了简直伤人的地步。</p>
<p>知乎的择偶标准，逐渐成了各位女生的向往：<br>身高185；<br>月薪5万+；<br>至少在二线城市有车有房且不用还贷；<br>学历985硕士起步，最好本科清北并在全球top5名校有过留洋经历；<br>原生家庭小康，父母知书达理且不存在重大家庭矛盾……</p>
<p>在这类文字的评论区，多少青春少女围坐欢呼，满怀憧憬，认为只有这样的“正常男子”才能配得上自己。达不到如此标准的，都难逃被粗暴扣上各类帽子的命运：舔狗、癞蛤蟆男、凤凰男、猥琐男、直男癌、妈宝男……</p>
<p>那么现实世界中真正的正常人，在情场的生存状况是什么样子呢？</p>
<p>“舔狗舔到最后一无所有。”<br>“你看这个人好烦啊，长成那个样子，还天天给我发这么恶心的情话。”<br>“我真的想和你做很好的朋友，可是你能不能打消和我在一起的念头，不要再给我压力了？”</p>
<p>稍微幸运一些的，抱得美人归之后的生活也不如人意：</p>
<p>“他爱不爱你，看购物车就知道了。”</p>
<p>“不管怎样，希望女朋友是处女的都是无可救药的直男癌。”</p>
<p>“送两百块的口红，不如送她自由。”</p>
<p>“买房我一分钱都不会出，他是男生，应该通过自己奋斗，并且加上父母半辈子积蓄来买车买房。最重要的是，房子必须加上我的名字，不然就是不爱我、没诚意、算计我。”…..</p>
<p>以著名情感某大V为首的一堆营销号，凭借着一堆鸡汤爽文，不知不觉给大部分本是纯真善良的女孩儿洗了脑。她们开始怀疑自己的独立、自尊、自爱、自立、自强、内心强大、有思想、有内涵、尊重别人、善解人意、通过自身价值和实际能力换得的人家的尊重和珍惜。她们觉得优秀的女人不会傻乎乎地自己拼命，勾勾手指就有舔狗上门俯首称臣的生活才是她们价值和魅力的体现。真正的爱情不再被欣赏，体贴恋人的女生也会被人指责“太傻”。不管人家感情多幸福，也总有田园女权要站出来，拎着女孩的耳朵，告诉她：这样做太亏太傻，为爱情牺牲没有好下场。恋爱逐渐成了一座围城，城内的男生如坐针毡，城外的男生望洋兴叹。</p>
</li>
<li><p>3.这个社会，一直都在给男生贩卖焦虑。</p>
<p>“寒门状元之死，原生家庭决定了你一辈子的高度。”</p>
<p>“不满175的男生都是diao丝，不满170的都是二级残废。”</p>
<p>“专科的男生，不配有后代。”……</p>
</li>
</ul>
</div>
<footer class="article-footer">
<a data-url="http://SunOfHomeBoy.github.io/2019/08/21/游戏-恋爱/" data-id="ck1t2f659001srcduzrpspim0" class="article-share-link">分享</a>
<ul class="article-tag-list"><li class="article-tag-list-item"><a class="article-tag-list-link" href="/tags/恋爱/">恋爱</a></li></ul>
</footer>
</div>
</article>
<article id="post-DataStructures&Algorithm/JS数据结构" class="wow slideInRight article article-type-post" itemscope itemprop="blogPost">
<div class="article-meta">
<a href="/2019/08/08/DataStructures&Algorithm/JS数据结构/" class="article-date">
<time class="post-time" datetime="2019-08-08T08:32:30.000Z" itemprop="datePublished">
<span class="post-month">8月</span><br/>
<span class="post-day">08</span>
</time>
</a>
</div>
<div class="article-inner">
<header class="article-header">
<h1 itemprop="name">
<a class="article-title" href="/2019/08/08/DataStructures&Algorithm/JS数据结构/">JS数据结构</a>
</h1>
<div>
<div class="article-category">
<a class="article-category-link" href="/categories/DS-A/">DS&A</a>
</div>
|
<div class="view-box">
<span id="/2019/08/08/DataStructures&Algorithm/JS数据结构/" class="leancloud_visitors" data-flag-title="JS数据结构">
阅读次数<span class="leancloud-visitors-count"></span>
</span>
</div>
</div>
</header>
<div class="article-entry" itemprop="articleBody">
<h1 id="前端数据结构与算法"><a href="#前端数据结构与算法" class="headerlink" title="前端数据结构与算法"></a><a href="https://yq.aliyun.com/articles/613456" target="_blank" rel="noopener">前端数据结构与算法</a></h1><h2 id="js数据类型"><a href="#js数据类型" class="headerlink" title="js数据类型"></a>js数据类型</h2><ul>
<li><p>基本类型(栈 stack) : Number、String 、Boolean、Null 和 Undefined , Symbol(es6 新增)； 基本数据类型是按值访问 由高向低分配,栈内存最大是 8MB,(超出报栈溢出)， String:是特殊的栈内存 (向高分配大小不定),程序员分配</p>
</li>
<li><p>引用类型(堆 heap) :Object 、Array 、Function 、Data；引用类型数据在栈内存中保存的实际上是对象在堆内存中的引用地址(指针),向高分配,系统自动分配</p>
</li>
</ul>
<h2 id="一、堆栈空间分配区别："><a href="#一、堆栈空间分配区别：" class="headerlink" title="一、堆栈空间分配区别："></a>一、堆栈空间分配区别：</h2><ul>
<li><p>栈(操作系统): 由操作系统自动分配释放 ，存放函数的参数值，局部变量的值等。其操作方式类似于数据结构中的栈;</p>
</li>
<li><p>堆(操作系统): 一般由程序员分配释放，若程序员不释放，程序结束时可能由 OS 回收，分配方式倒是类似于链表。</p>
</li>
</ul>
<h2 id="二、堆栈缓存方式区别："><a href="#二、堆栈缓存方式区别：" class="headerlink" title="二、堆栈缓存方式区别："></a>二、堆栈缓存方式区别：</h2><ul>
<li><p>栈使用的是一级缓存， 他们通常都是被调用时处于存储空间中，调用完毕立即释放；</p>
</li>
<li><p>堆是存放在二级缓存中，生命周期由虚拟机的垃圾回收算法来决定(并不是一旦成为孤儿对象就能被回收)。所以调用这些对象的速度要相对来得低一些。</p>
</li>
</ul>
<h2 id="三、堆-、栈数据结构区别："><a href="#三、堆-、栈数据结构区别：" class="headerlink" title="三、堆 、栈数据结构区别："></a>三、堆 、栈数据结构区别：</h2><ul>
<li><p>堆(数据结构)：堆可以被看成是一棵树，如：堆排序;</p>
</li>
<li><p>栈(数据结构)：一种先进后出的数据结构。</p>
</li>
</ul>
<h2 id="数据结构"><a href="#数据结构" class="headerlink" title="数据结构"></a>数据结构</h2><p>数据结构 是指 相互之间存在着一种或多种关系的数据元素的集合和该集合中数据元素之间的关系组成;数据结构的基本操作的设置的最重要的准则是,实现应用程序与存储结构的独立(数据结构=数据的存储+算法)</p>
<p><img src="../../assets/img/sjjg.webp" alt="数据结构"></p>
<h2 id="数据结构分类"><a href="#数据结构分类" class="headerlink" title="数据结构分类"></a>数据结构分类</h2><p><strong>逻辑结构: 反映数据之间的逻辑关系;</strong><br><figure class="highlight md"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line">集合: 结构中的数据元素除了同属于一种类型外，别无其它关系。(无逻辑关系)</span><br><span class="line">线性结构: 数据元素之间一对一的关系(线性表)</span><br><span class="line">树形结构: 数据元素之间一对多的关系(非线性)</span><br><span class="line">图状结构 | 网状结构: 结构中的数据元素之间存在多对多的关系(非线性)</span><br></pre></td></tr></table></figure></p>
<p><strong>存储结构: 数据结构在计算机中的表示;</strong><br><figure class="highlight md"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line">顺序存储数据结构</span><br><span class="line">链式存储数据结构</span><br><span class="line">索引存储数据结构</span><br><span class="line">散列存储数据结构</span><br></pre></td></tr></table></figure></p>
<p><strong>线性结构</strong><br><figure class="highlight md"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line">队列: 也是一种运算受限的线性表。它只允许在表的一端进行插入，而在另一端进行删除。允许删除的一端称为队头(front)，允许插入的一端称为队尾(rear)。先进先出。</span><br><span class="line"></span><br><span class="line">栈: 是限制在表的一端进行插入和删除运算的线性表，通常称插入、删除的这一端为栈顶(Top)，另一端为栈底(Bottom)。先进后出。top= -1时为空栈，top=0只能说明栈中只有一个元素，并且元素进栈时top应该自增。后进先出。</span><br><span class="line"></span><br><span class="line">串: 是零个或多个字符组成的有限序列。长度为零的串称为空串(Empty String)，它不包含任何字符。通常将仅由一个或多个空格组成的串称为空白串(Blank String) 注意：空串和空白串的不同，例如" "和""分别表示长度为1的空白串和长度为0的空串。</span><br></pre></td></tr></table></figure></p>
<p><strong>非线性结构</strong><br><figure class="highlight md"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br></pre></td><td class="code"><pre><span class="line">树: 一种非线性结构。树是递归结构，在树的定义中又用到了树的概念.</span><br><span class="line"></span><br><span class="line">有序树: 子节点之间有顺序关系</span><br><span class="line"></span><br><span class="line">无序树: 子节点之间没有顺序关系</span><br><span class="line"></span><br><span class="line">二叉树: 一种非线性结构。树是递归结构，在树的定义中又用到了树的概念</span><br></pre></td></tr></table></figure></p>
<p><strong>二叉树遍历:</strong></p>
<p>使得每一个结点均被访问一次，而且仅被访问一次。非递归的遍历实现要利用栈。</p>
<figure class="highlight md"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br></pre></td><td class="code"><pre><span class="line"><span class="bullet">+ </span>先序遍历DLR：根节点->左子树->右子树(广度遍历)</span><br><span class="line"></span><br><span class="line"><span class="bullet">+ </span>中序遍历LDR：左子树->根节点->右子树。必须要有中序遍历才能得到一棵二叉树的正确顺序(广度遍历)</span><br><span class="line"></span><br><span class="line"><span class="bullet">+ </span>后续遍历LRD：左子树->右子树->根节点。需要栈的支持。(广度遍历)</span><br><span class="line"></span><br><span class="line"><span class="bullet">+ </span>层次遍历：用一维数组存储二叉树时,总是以层次遍历的顺序存储结点。层次遍历应该借助队列。(深度遍历)</span><br></pre></td></tr></table></figure>
<p><img src="../../assets/img/binaryTree.webp" alt="二叉树"></p>
<h2 id="内存-一条很长一维数组"><a href="#内存-一条很长一维数组" class="headerlink" title="内存: 一条很长一维数组"></a>内存: 一条很长一维数组</h2><h2 id="算法"><a href="#算法" class="headerlink" title="算法"></a>算法</h2><h3 id="算法特征："><a href="#算法特征：" class="headerlink" title="算法特征："></a>算法特征：</h3><p>有穷性、确定性、可行性、输入、输出</p>
<h3 id="算法设计衡量："><a href="#算法设计衡量：" class="headerlink" title="算法设计衡量："></a>算法设计衡量：</h3><p>正确性、可读性、健壮性、时间复杂度、空间复杂度</p>
<h3 id="算法分类："><a href="#算法分类：" class="headerlink" title="算法分类："></a>算法分类：</h3><ul>
<li>快速排序</li>
<li>堆排序</li>
<li><p>归并排序</p>
</li>
<li><p>二分查找</p>
</li>
<li><p>线性查找</p>
</li>
<li><p>深度优先</p>
</li>
<li><p>广度优先</p>
</li>
<li><p>戴克斯特拉</p>
</li>
<li>动态规划</li>
<li>贝叶斯分类</li>
</ul>
<h3 id="基本算法-必会"><a href="#基本算法-必会" class="headerlink" title="基本算法(必会)"></a>基本算法(必会)</h3><ul>
<li><p>冒泡排序<br><img src="../../assets/img/mppx.gif" alt="冒泡排序"></p>
<figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br></pre></td><td class="code"><pre><span class="line"><span class="function"><span class="keyword">function</span> <span class="title">bubbleSort</span>(<span class="params">arr</span>) </span>{</span><br><span class="line"> <span class="keyword">var</span> len = arr.length;</span><br><span class="line"> <span class="keyword">for</span> (<span class="keyword">var</span> i = <span class="number">0</span>; i < len - <span class="number">1</span>; i++) {</span><br><span class="line"> <span class="keyword">for</span> (<span class="keyword">var</span> j = <span class="number">0</span>; j < len - <span class="number">1</span> - i; j++) {</span><br><span class="line"> <span class="keyword">if</span> (arr[j] > arr[j+<span class="number">1</span>]) {</span><br><span class="line"> <span class="keyword">var</span> temp = arr[j+<span class="number">1</span>];</span><br><span class="line"> arr[j+<span class="number">1</span>] = arr[j];</span><br><span class="line"> arr[j] = temp;</span><br><span class="line"> }</span><br><span class="line"> }</span><br><span class="line"> }</span><br><span class="line"> <span class="keyword">return</span> arr</span><br><span class="line">}</span><br></pre></td></tr></table></figure>
</li>
<li><p>快速排序<br><img src="../../assets/img/QuickSort.gif" alt="快速排序"></p>
<figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br></pre></td><td class="code"><pre><span class="line"><span class="function"><span class="keyword">function</span> <span class="title">swap</span>(<span class="params">items, firstIndex, secondIndex</span>) </span>{</span><br><span class="line"> <span class="keyword">var</span> temp = items[firstIndex];</span><br><span class="line"> items[firstIndex] = items[secondIndex];</span><br><span class="line"> items[secondIndex] = temp;</span><br><span class="line">}</span><br><span class="line"></span><br><span class="line"><span class="function"><span class="keyword">function</span> <span class="title">partition</span>(<span class="params">items, left, right</span>) </span>{</span><br><span class="line"> <span class="keyword">var</span> pivot = items[<span class="built_in">Math</span>.floor((left + right) / <span class="number">2</span>)],</span><br><span class="line"> i = left, </span><br><span class="line"> j = right; </span><br><span class="line"> <span class="keyword">while</span> (i <= j) {</span><br><span class="line"> <span class="keyword">while</span> (items[i] < pivot) i++;</span><br><span class="line"> <span class="keyword">while</span> (items[j] < pivot) j--;</span><br><span class="line"> <span class="keyword">if</span> (i <= j) {</span><br><span class="line"> swap(items, i, j)</span><br><span class="line"> i++</span><br><span class="line"> j--</span><br><span class="line"> }</span><br><span class="line"> }</span><br><span class="line"> <span class="keyword">return</span> i</span><br><span class="line">}</span><br><span class="line"></span><br><span class="line"><span class="function"><span class="keyword">function</span> <span class="title">quickSort</span>(<span class="params">items, left, right</span>) </span>{</span><br><span class="line"> <span class="keyword">var</span> index;</span><br><span class="line"> <span class="keyword">if</span> (items.length > <span class="number">1</span>) {</span><br><span class="line"> index = partition(items, left, right);</span><br><span class="line"> <span class="keyword">if</span> (left < index <span class="number">-1</span>) quickSort(items, left, index <span class="number">-1</span>)</span><br><span class="line"> <span class="keyword">if</span> (index < right) quickSort(items, index, right)</span><br><span class="line"> }</span><br><span class="line"> <span class="keyword">return</span> items;</span><br><span class="line">}</span><br></pre></td></tr></table></figure>
</li>
<li><p>插入排序<br><img src="../../assets/img/insertionSorting.gif" alt="插入排序"></p>
<figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br></pre></td><td class="code"><pre><span class="line"><span class="function"><span class="keyword">function</span> <span class="title">insertionSorting</span>(<span class="params">arr</span>) </span>{</span><br><span class="line"> <span class="keyword">var</span> len = arr.length;</span><br><span class="line"> <span class="keyword">var</span> preIndex, current;</span><br><span class="line"> <span class="keyword">for</span>(<span class="keyword">var</span> i = <span class="number">1</span>; i < len; i++) {</span><br><span class="line"> preIndex = i - <span class="number">1</span>;</span><br><span class="line"> current = arr[i];</span><br><span class="line"> <span class="keyword">while</span>(preIndex >= <span class="number">0</span> && arr[preIndex] > current) {</span><br><span class="line"> arr[preIndex+<span class="number">1</span>] = arr[preIndex];</span><br><span class="line"> preIndex--</span><br><span class="line"> }</span><br><span class="line"> arr[preIndex+<span class="number">1</span>] = current;</span><br><span class="line"> }</span><br><span class="line"> <span class="keyword">return</span> arr</span><br><span class="line">}</span><br></pre></td></tr></table></figure>
</li>
<li><p>选择排序<br><img src="../../assets/img/selectionSort.gif" alt="选择排序"></p>
<figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br></pre></td><td class="code"><pre><span class="line"><span class="function"><span class="keyword">function</span> <span class="title">selectionSort</span>(<span class="params">arr</span>) </span>{</span><br><span class="line"> <span class="keyword">var</span> len = arr.length;</span><br><span class="line"> <span class="keyword">var</span> minIndex, temp;</span><br><span class="line"> <span class="keyword">for</span> (<span class="keyword">let</span> i = <span class="number">0</span>; i < len <span class="number">-1</span>; i++) {</span><br><span class="line"> minIndex = i;</span><br><span class="line"> <span class="keyword">for</span> (<span class="keyword">let</span> j = i + <span class="number">1</span>; j < len; j++) {</span><br><span class="line"> <span class="keyword">if</span> (arr[j] < arr[minIndex]) minIndex = j;</span><br><span class="line"> }</span><br><span class="line"> temp = arr[i];</span><br><span class="line"> arr[i] = arr[minIndex];</span><br><span class="line"> arr[minIndex] = temp;</span><br><span class="line"> }</span><br><span class="line"> <span class="keyword">return</span> arr</span><br><span class="line">}</span><br></pre></td></tr></table></figure>
</li>
</ul>
<h4 id="时-空间复杂度"><a href="#时-空间复杂度" class="headerlink" title="时/空间复杂度"></a>时/空间复杂度</h4><p>在冒泡排序，插入排序，选择排序，快速排序中，在最最坏情况下，快速排序的时间复杂为O(n2) ，插入排序O(n2)，选择排序O(n2)，冒泡排序O(n2)</p>
<p><img src="../../assets/img/complexity.png" alt="算法时/空间复杂度"></p>
</div>
<footer class="article-footer">
<a data-url="http://SunOfHomeBoy.github.io/2019/08/08/DataStructures&Algorithm/JS数据结构/" data-id="ck1t2f69q0032rcdu0v04ws3f" class="article-share-link">分享</a>
<ul class="article-tag-list"><li class="article-tag-list-item"><a class="article-tag-list-link" href="/tags/JS数据结构/">JS数据结构</a></li></ul>
</footer>
</div>
</article>
<nav id="page-nav">
<span class="page-number current">1</span><a class="page-number" href="/page/2/">2</a><a class="page-number" href="/page/3/">3</a><span class="space">…</span><a class="page-number" href="/page/37/">37</a><a class="extend next" rel="next" href="/page/2/">next »</a>
</nav>
</section>
<aside id="sidebar">
<div class="widget-wrap">
<h3 class="widget-title"></h3>
<div class="widget">
<h1 class="blog-title">李仕臣的博客</h1>
<h2 class="blog-subtitle">geek who devotion to write code.</h2>
<ul class="blog-link">
<a href="/" title="Home">
<li>主页</li>
</a>
<a href="/archives" title="Archives">
<li>归档</li>
</a>
<a href="/categories" title="Categories">
<li>分类</li>
</a>
<a href="/tags" title="Tags">
<li>标签</li>
</a>
</ul>
</div>
</div>
<div class="widget-wrap">
<h3 class="widget-title"></h3>
<div class="widget">
<img class="avatar" src="https://avatars2.githubusercontent.com/u/30047595?s=460&v=4">
<h2 class="author">李仕臣</h2>
<h3 class="description">李仕臣的博客</h3>
<div class="count-box">
<a href="/archives"><div><strong>183</strong><br>文章</div></a>
<a href="/categories"><div><strong>87</strong><br>分类</div></a>
<a href="/tags"><div><strong>136</strong><br>标签</div></a>
</div>
<div class="social-link">
<a class="hvr-bounce-in" href="https://github.com/SunOfHomeBoy" target="_blank" title="Github">
Github
</a>
</div>
<div class="friend-link">
<h2>友情链接</h2>
<a class="hvr-bounce-in" href="http://weibo.com/1691891903/profile?topnav=1&wvr=6" target="_blank" title="Sina微博">
Sina微博
</a>
<a class="hvr-bounce-in" href="" target="_blank" title="个人邮箱：[email protected]">
个人邮箱：[email protected]
</a>
</div>
</div>
</div>
</aside>
</div>
<footer id="footer">
<div class="outer">
<div id="footer-info" class="inner">
©2018 - 2019 李仕臣<br>
由<a href="http://hexo.io/" target="_blank">Hexo</a>强力驱动 |
主题-<a href="https://github.com/ShanaMaid/hexo-theme-shana">Shana</a>
</div>
</div>
</footer>
</div>
<script src="//apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
<script src="//apps.bdimg.com/libs/wow/0.1.6/wow.min.js"></script>
<script>
new WOW().init();
</script>
<link rel="stylesheet" href="/plugin/fancybox/jquery.fancybox.css">
<script src="/plugin/fancybox/jquery.fancybox.pack.js"></script>
<link rel="stylesheet" href="/plugin/galmenu/GalMenu.css">
<script src="/plugin/galmenu/GalMenu.js"></script>
<div class="GalMenu GalDropDown">
<div class="circle" id="gal">
<div class="ring">
<a href="/" title="" class="menuItem">首页</a>
<a href="/tags" title="" class="menuItem">标签</a>
<a href="/categories" title="" class="menuItem">分类</a>
<a href="/archives" title="" class="menuItem">归档</a>
</div>
<audio id="audio" src="plugin/galmenu/wulusai.mp3"></audio>
</div>
</div>
<div id="overlay" style="opacity: 1; cursor: pointer;"></div>
<script type="text/javascript">var items = document.querySelectorAll('.menuItem');
for (var i = 0,
l = items.length; i < l; i++) {
items[i].style.left = (50 - 35 * Math.cos( - 0.5 * Math.PI - 2 * (1 / l) * i * Math.PI)).toFixed(4) + "%";
items[i].style.top = (50 + 35 * Math.sin( - 0.5 * Math.PI - 2 * (1 / l) * i * Math.PI)).toFixed(4) + "%"
}</script>
<script type="text/javascript">
$(document).ready(function() {
$('body').GalMenu({
'menu': 'GalDropDown'
})
});
</script>
<section class="hidden-xs">
<ul class="cb-slideshow">
<li><span>苟利</span></li>
<li><span>国家</span></li>
<li><span>生死以</span></li>
<li><span>岂能</span></li>
<li><span>祸福</span></li>
<li><span>趋避之</span></li>
</ul>
</section>
<script src="/js/script.js"></script>
<script src="https://cdn1.lncld.net/static/js/av-core-mini-0.6.1.js"></script>
<script>AV.initialize("true", "true");</script>
<script>
function showTime(Counter) {
var query = new AV.Query(Counter);
var entries = [];
var $visitors = $(".leancloud_visitors");
$visitors.each(function () {
entries.push( $(this).attr("id").trim() );
});
query.containedIn('url', entries);
query.find()
.done(function (results) {
var COUNT_CONTAINER_REF = '.leancloud-visitors-count';
if (results.length === 0) {
$visitors.find(COUNT_CONTAINER_REF).text(0);
return;
}
for (var i = 0; i < results.length; i++) {
var item = results[i];
var url = item.get('url');
var time = item.get('time');
var element = document.getElementById(url);
$(element).find(COUNT_CONTAINER_REF).text(time);
}
for(var i = 0; i < entries.length; i++) {
var url = entries[i];
var element = document.getElementById(url);
var countSpan = $(element).find(COUNT_CONTAINER_REF);
if( countSpan.text() == '') {
countSpan.text(0);
}
}
})
.fail(function (object, error) {
console.log("Error: " + error.code + " " + error.message);
});
}
function addCount(Counter) {
var $visitors = $(".leancloud_visitors");
var url = $visitors.attr('id').trim();
var title = $visitors.attr('data-flag-title').trim();
var query = new AV.Query(Counter);
query.equalTo("url", url);
query.find({
success: function(results) {
if (results.length > 0) {
var counter = results[0];
counter.fetchWhenSave(true);
counter.increment("time");
counter.save(null, {
success: function(counter) {
var $element = $(document.getElementById(url));
$element.find('.leancloud-visitors-count').text(counter.get('time'));
},
error: function(counter, error) {
console.log('Failed to save Visitor num, with error message: ' + error.message);
}
});
} else {
var newcounter = new Counter();
/* Set ACL */
var acl = new AV.ACL();
acl.setPublicReadAccess(true);
acl.setPublicWriteAccess(true);
newcounter.setACL(acl);
/* End Set ACL */
newcounter.set("title", title);
newcounter.set("url", url);
newcounter.set("time", 1);
newcounter.save(null, {
success: function(newcounter) {
var $element = $(document.getElementById(url));
$element.find('.leancloud-visitors-count').text(newcounter.get('time'));
},
error: function(newcounter, error) {
console.log('Failed to create');
}
});
}
},
error: function(error) {
console.log('Error:' + error.code + " " + error.message);
}
});
}
$(function() {
var Counter = AV.Object.extend("Counter");
if ($('.leancloud_visitors').length == 1) {
addCount(Counter);
} else if ($('.article-title').length > 1) {
showTime(Counter);
}
});
</script>
</div>
</body>
</html>