-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
650 lines (494 loc) · 27.1 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
<!DOCTYPE html>
<!--[if lte IE 8 ]>
<html class="ie" xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-US" lang="en-US">
<![endif]-->
<!--[if (gte IE 9)|!(IE)]><!-->
<!--
*************** * * *
8 * * *
8 * * *
8 ** *
8 * * *
8 * * *
8 * * *
8 * * *********** -----Theme By Kieran(http://go.kieran.top)
-->
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-US" lang="en-US">
<!--<![endif]-->
<head>
<title>Varman 前端开发-李祺</title>
<!-- Meta data -->
<meta http-equiv="Content-Type" content="text/html" charset="UTF-8" >
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="generator" content="Varman 前端开发-李祺">
<meta name="author" content="Varman">
<meta name="description" content="弱小的人能够保护什么?" />
<meta name="keywords" content="varman,前端开发,李祺" />
<!-- Favicon, (keep icon in root folder) -->
<link rel="Shortcut Icon" href="/img/favicon.ico" type="image/ico">
<link rel="alternate" href="/atom.xml" title="Varman 前端开发-李祺" type="application/atom+xml">
<link rel="stylesheet" href="/css/all.css" media="screen" type="text/css">
<link rel="stylesheet" href="/highlightjs/vs.css" type="text/css">
<!-- Custom stylesheet, (add custom styles here, always load last) -->
<!-- Load our stylesheet for IE8 -->
<!--[if IE 8]>
<link rel="stylesheet" type="text/css" href="/css/ie8.css" />
<![endif]-->
<!-- Google Webfonts (Monserrat 400/700, Open Sans 400/600) -->
<link href='//fonts.useso.com/css?family=Montserrat:400,700' rel='stylesheet' type='text/css'>
<link href='//fonts.useso.com/css?family=Open+Sans:400,600' rel='stylesheet' type='text/css'>
<!-- Load our fonts individually if IE8+, to avoid faux bold & italic rendering -->
<!--[if IE]>
<link href='http://fonts.useso.com/css?family=Montserrat:400' rel='stylesheet' type='text/css'>
<link href='http://fonts.useso.com/css?family=Montserrat:700' rel='stylesheet' type='text/css'>
<link href='http://fonts.useso.com/css?family=Open+Sans:400' rel='stylesheet' type='text/css'>
<link href='http://fonts.useso.com/css?family=Open+Sans:600' rel='stylesheet' type='text/css'>
<![endif]-->
<!-- jQuery | Load our jQuery, with an alternative source fallback to a local version if request is unavailable -->
<script src="/js/jquery-1.11.1.min.js"></script>
<script>window.jQuery || document.write('<script src="js/jquery-1.11.1.min.js"><\/script>')</script>
<!-- Load these in the <head> for quicker IE8+ load times -->
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
<script src="/js/html5shiv.min.js"></script>
<script src="/js/respond.min.js"></script>
<![endif]-->
<style>.col-md-8.col-md-offset-2.opening-statement img{display:none;}</style>
</head>
<!--
<body class="home-template">
-->
<body id="index" class="lightnav animsition">
<!-- ============================ Off-canvas navigation =========================== -->
<div class="sb-slidebar sb-right sb-style-overlay sb-momentum-scrolling">
<div class="sb-close" aria-label="Close Menu" aria-hidden="true">
<img src="/img/close.png" alt="Close"/>
</div>
<!-- Lists in Slidebars -->
<ul class="sb-menu">
<li><a href="/" class="animsition-link" title="Home">Home</a></li>
<li><a href="/archives" class="animsition-link" title="archive">archives</a></li>
<!-- Dropdown Menu -->
<li>
<a class="sb-toggle-submenu">Works<span class="sb-caret"></span></a>
<ul class="sb-submenu">
<li><a href="/" target="_BLANK" class="animsition-link">AAA</a></li>
<li><a href="/atom.xml" target="_BLANK" class="animsition-link">BBB</a></li>
</ul>
</li>
<li>
<a class="sb-toggle-submenu">Categories<span class="sb-caret"></span></a>
<ul class="sb-submenu">
<li><a href="/categories/AngularJS/" class="animsition-link">AngularJS<small>(0)</small></a></li>
<li><a href="/categories/CSS/" class="animsition-link">CSS<small>(0)</small></a></li>
<li><a href="/categories/HTTP/" class="animsition-link">HTTP<small>(1)</small></a></li>
<li><a href="/categories/JavaScript/" class="animsition-link">JavaScript<small>(0)</small></a></li>
<li><a href="/categories/Less/" class="animsition-link">Less<small>(0)</small></a></li>
<li><a href="/categories/Node-js/" class="animsition-link">Node.js<small>(0)</small></a></li>
<li><a href="/categories/Sass/" class="animsition-link">Sass<small>(0)</small></a></li>
<li><a href="/categories/JavaScript/开发规范/" class="animsition-link">开发规范<small>(0)</small></a></li>
<li><a href="/categories/CSS/开发规范/" class="animsition-link">开发规范<small>(0)</small></a></li>
</ul>
</li>
</ul>
<!-- Lists in Slidebars -->
<ul class="sb-menu secondary">
<li><a href="/about.html" class="animsition-link" title="about">About</a></li>
<li><a href="/atom.xml" class="animsition-link" title="rss">RSS</a></li>
</ul>
</div>
<!-- ============================ END Off-canvas navigation =========================== -->
<!-- ============================ #sb-site Main Page Wrapper =========================== -->
<div id="sb-site">
<!-- #sb-site - All page content should be contained within this id, except the off-canvas navigation itself -->
<!-- ============================ Header & Logo bar =========================== -->
<div id="navigation" class="navbar navbar-fixed-top">
<div class="navbar-inner">
<div class="container">
<!-- Nav logo -->
<div class="logo">
<a href="/" title="Logo" class="animsition-link">
<img src="/img/logo.png" alt="Logo" width="35px;"/>
</a>
</div>
<!-- // Nav logo -->
<!-- Info-bar -->
<nav>
<ul class="nav">
<li><a href="/" class="animsition-link">Varman 前端开发-李祺</a></li>
<li class="nolink"><span>Blog </span></li>
<li><a href="https://github.com/" title="Github" target="_blank"><i class="icon-github"></i></a></li>
<li><a href="https://twitter.com/" title="Twitter" target="_blank"><i class="icon-twitter"></i></a></li>
<li><a href="https://www.facebook.com/" title="Facebook" target="_blank"><i class="icon-facebook"></i></a></li>
<li><a href="https://google.com/" title="Google-Plus" target="_blank"><i class="icon-google-plus"></i></a></li>
<li><a href="http://weibo.com/" title="Sina-Weibo" target="_blank"><i class="icon-sina-weibo"></i></a></li>
<li class="nolink"><span>Welcome!</span></li>
</ul>
</nav>
<!--// Info-bar -->
</div>
<!-- // .container -->
<div class="learnmore sb-toggle-right">More</div>
<button type="button" class="navbar-toggle menu-icon sb-toggle-right" title="More">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar before"></span>
<span class="icon-bar main"></span>
<span class="icon-bar after"></span>
</button>
</div>
<!-- // .navbar-inner -->
</div>
<!-- ============================ Header & Logo bar =========================== -->
<!-- ============================ Hero Image =========================== -->
<section id="hero" class="scrollme">
<div class="container-fluid element-img" style="background: url(/img/bg_img.jpg) no-repeat center center fixed;background-size: cover">
<div class="row">
<div class="col-xs-12 col-sm-8 col-sm-offset-2 col-md-8 col-md-offset-2 vertical-align cover boost text-center">
<div class="center-me animateme" data-when="exit" data-from="0" data-to="0.6" data-opacity="0" data-translatey="100">
<div>
<h2>One day you will be the one you want to be.</h2>
<p></p>
<h2></h2>
<p>又一天过去了。今天过得怎么样，梦想是不是更远了？</p>
</div>
</div>
</div>
<!-- // .col-md-12 -->
</div>
<div class="herofade beige-dk"></div>
</div>
</section>
<!-- Height spacing helper -->
<div class="heightblock"></div>
<!-- // End height spacing helper -->
<!-- ============================ END Hero Image =========================== -->
<!-- ============================ Content =========================== -->
<section id="intro">
<div class="container">
<div class="row">
<div class="col-md-8 col-md-offset-2 opening-statement">
<div class="col-md-4">
<h3><a href="/2015/11/25/HTTP相关知识/">HTTP相关知识</a></h3>
<span>
<span class="post-meta">
<time datetime="2015-11-25T09:42:19.000Z" itemprop="datePublished">
Nov 25 2015
</time>
|
<a href='/tags/HTTP/'>HTTP</a>
</span>
</span>
</div>
<div class="col-md-8">
<p>
相关知识http 就是一种协议,计算机之间要共同遵守这个协议的规则才能相互通信
通常由http 客户端发起一个请求比如用手机上的浏览器打开一个网站，就会创建一个到服务器指定端口的TCP链接 http服务器就在那个端口监听客户端的请求，一旦受到请求，服务器就会向客户端返回一个状态.(比如200的状态码，同时返回内容，比如请求的文件,错误信息,json数据等)
域名解析,浏览器先搜索自身的DNS缓存,看有没有过期——如果缓存中没找到,那么浏
</p>
<p class="pull-right readMore">
<a href="/2015/11/25/HTTP相关知识/">Read More...</a>
</p>
</div>
<div class="clearfix"></div>
<hr class="nogutter">
</div>
</div>
<div class="row">
<div class="col-md-8 col-md-offset-2 opening-statement">
<div class="col-md-4">
<h3><a href="/2015/11/23/Node-js模块与Commonjs规范/">Node.js模块与Commonjs规范</a></h3>
<span>
<span class="post-meta">
<time datetime="2015-11-23T08:38:55.000Z" itemprop="datePublished">
Nov 23 2015
</time>
</span>
</span>
</div>
<div class="col-md-8">
<p>
Node.js模块与Commonjs规范====================
JavaScript 天生缺少模块管理机制，来隔离实现不同功能的js判断，避免他们相互污染，为此我们经常采用匿名空间的方式把变量和函数限制在某个特定的作用域内，约定一套命名规范来约束代码，从而保证代码的安全执行。
比如JQuery里面 其实有许多的变量和方法，但是你直接是访问不到的必须通过jquery或$符号来调用里面的方法。Commonjs 并不像JQu
</p>
<p class="pull-right readMore">
<a href="/2015/11/23/Node-js模块与Commonjs规范/">Read More...</a>
</p>
</div>
<div class="clearfix"></div>
<hr class="nogutter">
</div>
</div>
<div class="row">
<div class="col-md-8 col-md-offset-2 opening-statement">
<div class="col-md-4">
<h3><a href="/2015/03/26/JS作用域/">JS作用域</a></h3>
<span>
<span class="post-meta">
<time datetime="2015-03-26T08:22:16.000Z" itemprop="datePublished">
Mar 26 2015
</time>
</span>
</span>
</div>
<div class="col-md-8">
<p>
###JavaScript 作用域js中最常见的是全局作用域这里我们在最外层生成的变量a,这就是全局变量a，在这个全局范围内我们的for循环里面有var item 定义了一个变量item，我们可能会以为他是在for循环里面可见对外不可见，实际上这是错误的理解。在javascript里是没有块级作用域的，不管是for循环还是while里面定义的变量实际上跟for循环外面定义的变量是没有差别的.函数作用域比如这里我们的一个匿名立即执行的函数
</p>
<p class="pull-right readMore">
<a href="/2015/03/26/JS作用域/">Read More...</a>
</p>
</div>
<div class="clearfix"></div>
<hr class="nogutter">
</div>
</div>
<div class="row">
<div class="col-md-8 col-md-offset-2 opening-statement">
<div class="col-md-4">
<h3><a href="/2015/03/25/JS闭包/">JS闭包</a></h3>
<span>
<span class="post-meta">
<time datetime="2015-03-25T01:42:06.000Z" itemprop="datePublished">
Mar 25 2015
</time>
</span>
</span>
</div>
<div class="col-md-8">
<p>
###JavaScript 闭包在计算机科学中，闭包（Closure）是词法闭包（Lexical Closure）的简称，是引用了自由变量的函数。这个被引用的自由变量将和这个函数一同存在，即使已经离开了创造它的环境也不例外。所以，有另一种说法认为闭包是由函数和与其相关的引用环境组合而成的实体。闭包在运行时可以有多个实例，不同的引用环境和相同的函数组合可以产生不同的实例。 –维基百科JavaScript中的函数也是对象,
</p>
<p class="pull-right readMore">
<a href="/2015/03/25/JS闭包/">Read More...</a>
</p>
</div>
<div class="clearfix"></div>
<hr class="nogutter">
</div>
</div>
<div class="row">
<div class="col-md-8 col-md-offset-2 opening-statement">
<div class="col-md-4">
<h3><a href="/2015/03/24/JS函数/">JS函数</a></h3>
<span>
<span class="post-meta">
<time datetime="2015-03-24T01:35:10.000Z" itemprop="datePublished">
Mar 24 2015
</time>
</span>
</span>
</div>
<div class="col-md-8">
<p>
###JavaScript函数函数是一块JavaScript代码,被定义一次,但可以执行和调用多次.JavaScript中的函数也是对象,所以函数可以像其他对象那样操作和传递,所以也常叫JavaScript中的函数为函数对象。这是一个标准的函数由函数名，参数列表，函数体组成:1function foo(x,y){ if(typeof x == 'number' && typeof y
</p>
<p class="pull-right readMore">
<a href="/2015/03/24/JS函数/">Read More...</a>
</p>
</div>
<div class="clearfix"></div>
<hr class="nogutter">
</div>
</div>
<div class="row">
<div class="col-md-8 col-md-offset-2 opening-statement">
<div class="col-md-4">
<h3><a href="/2015/03/23/JS数组/">JS数组</a></h3>
<span>
<span class="post-meta">
<time datetime="2015-03-23T07:46:59.000Z" itemprop="datePublished">
Mar 23 2015
</time>
</span>
</span>
</div>
<div class="col-md-8">
<p>
###JavaScript 数组数组是值的有序集合,每个值叫做元素,每个元素在数组中都有数字位置编号,也就是索引。js中的数组是弱类型的,数组中可以含有不同类型的元素,数组元素甚至可以是对象或其他数组。var arr=[1,true,null,undefined,{x:1},[1,2,3]]创建数组 字面量创建1 var BAT=['Alibaba','Tenecnt','Baidu']
</p>
<p class="pull-right readMore">
<a href="/2015/03/23/JS数组/">Read More...</a>
</p>
</div>
<div class="clearfix"></div>
<hr class="nogutter">
</div>
</div>
<div class="row">
<div class="col-md-8 col-md-offset-2 opening-statement">
<div class="col-md-4">
<h3><a href="/2015/03/11/JS对象/">JS对象</a></h3>
<span>
<span class="post-meta">
<time datetime="2015-03-11T09:27:04.000Z" itemprop="datePublished">
Mar 11 2015
</time>
</span>
</span>
</div>
<div class="col-md-8">
<p>
###JavaScript对象对象在js中非常重要,对象中包含一系列属性,这些属性是无序的,每个属性都有一个字符串key和对应的value.js对象中的每个属性有很多属性标签 ,每个对象还有一个原形,一个class标签(表示对象是哪个种类)，一个extensible标签(说明对象是否允许 新增属性)
#####创建对象
######对象字面量1var obj1={ x : 1, y : 2
</p>
<p class="pull-right readMore">
<a href="/2015/03/11/JS对象/">Read More...</a>
</p>
</div>
<div class="clearfix"></div>
<hr class="nogutter">
</div>
</div>
<div class="row">
<div class="col-md-8 col-md-offset-2 opening-statement">
<div class="col-md-4">
<h3><a href="/2015/03/11/JS语句/">JS语句</a></h3>
<span>
<span class="post-meta">
<time datetime="2015-03-11T08:41:01.000Z" itemprop="datePublished">
Mar 11 2015
</time>
</span>
</span>
</div>
<div class="col-md-8">
<p>
###JavaScript 语句JavaScript程序由语句组成,语句遵循特定的语法规则
#####blockblock块语句,常用于组合0-多个语句.语句用一对花括号定义.JavaScript有函数作用域,全局作用域但是没有块级作用域所以在for循环外面依然可以拿到I的值
#####var1var a=b=1; // b 相当于是全局Ö
</p>
<p class="pull-right readMore">
<a href="/2015/03/11/JS语句/">Read More...</a>
</p>
</div>
<div class="clearfix"></div>
<hr class="nogutter">
</div>
</div>
<div class="row">
<div class="col-md-8 col-md-offset-2 opening-statement">
<div class="col-md-4">
<h3><a href="/2015/03/06/JS表达式与运算符/">JS表达式与运算符</a></h3>
<span>
<span class="post-meta">
<time datetime="2015-03-06T08:40:27.000Z" itemprop="datePublished">
Mar 6 2015
</time>
</span>
</span>
</div>
<div class="col-md-8">
<p>
###JS表达式和运算符
#####表达式在维基百科中 表达式是指能计算出值得任何可用程序单元JS权威指南中 表达式是一种JS短语,可使JS解释器用来产生一个值.
######原始表达式 (常量,直接量(3.14,”test”),关键字(null,this,true),变量(i,k,j))
原始表达式可以和运算符 组成 符合表达式 如110 * 20
######除了原始表达式以外,还有 数组,对象的初始化表达式1[1,2] /
</p>
<p class="pull-right readMore">
<a href="/2015/03/06/JS表达式与运算符/">Read More...</a>
</p>
</div>
<div class="clearfix"></div>
<hr class="nogutter">
</div>
</div>
<div class="row">
<div class="col-md-8 col-md-offset-2 opening-statement">
<div class="col-md-4">
<h3><a href="/2015/03/06/JS数据类型/">JS数据类型</a></h3>
<span>
<span class="post-meta">
<time datetime="2015-03-06T07:05:13.000Z" itemprop="datePublished">
Mar 6 2015
</time>
</span>
</span>
</div>
<div class="col-md-8">
<p>
###JS数据类型JS是弱类型语言,定义变量时候无需指定类型.var num = 32;
完后也可以把字符串 赋值给这个变量1num = "this is a string"; 32 + 32 // 64 “32” + 32 // "3232" “32” - 32 // 0
JS因为不需要指定类型 ,在一些运算的时候有
</p>
<p class="pull-right readMore">
<a href="/2015/03/06/JS数据类型/">Read More...</a>
</p>
</div>
<div class="clearfix"></div>
<hr class="nogutter">
</div>
</div>
<nav class="pagination" role="pagination">
<a class="pull-right" href="/page/2/">Older Posts →</a>
</nav>
</div>
</section>
<section id="statement">
<div class="container text-center wow fadeInUp" data-wow-delay="0.5s">
<div class="row">
<p>You have to believe in yourself. That is the secret of success</p>
</div>
</div>
</section>
<!-- ============================ END Content =========================== -->
<!-- ============================ Footer =========================== -->
<script async src="//dn-lbstatics.qbox.me/busuanzi/2.3/busuanzi.pure.mini.js"></script>
<footer>
<div class="container">
<div class="copy">
<span id="busuanzi_container_site_pv">
总访问量<span id="busuanzi_value_site_pv"></span>次
</span>
<span id="busuanzi_container_site_uv">
访客数<span id="busuanzi_value_site_uv"></span>人次
</span>
<p>by varman</p>
</div>
<div class="social">
<ul>
<li><a href="https://github.com/" title="Github" target="_blank"><i class="icon-github"></i></a> </li>
<li><a href="https://twitter.com/" title="Twitter" target="_blank"><i class="icon-twitter"></i></a> </li>
<li><a href="https://www.facebook.com/" title="Facebook" target="_blank"><i class="icon-facebook"></i></a> </li>
<li><a href="https://google.com/" title="Google-Plus" target="_blank"><i class="icon-google-plus"></i></a> </li>
<li><a href="http://weibo.com/" title="Sina-Weibo" target="_blank"><i class="icon-sina-weibo"></i></a> </li>
</ul>
</div>
<div class="clearfix"> </div>
</div>
</footer>
<!-- ============================ END Footer =========================== -->
<!-- Load our scripts -->
<!-- Resizable 'on-demand' full-height hero -->
<script type="text/javascript">
var resizeHero = function () {
var hero = $(".cover,.heightblock"),
window1 = $(window);
hero.css({
"height": window1.height()
});
};
resizeHero();
$(window).resize(function () {
resizeHero();
});
</script>
<script src="/js/plugins.min.js"></script><!-- Bootstrap core and concatenated plugins always load here -->
<script src="/js/jquery.flexslider-min.js"></script><!-- Flexslider plugin -->
<script src="/js/scripts.js"></script><!-- Theme scripts -->
<!-- Initiate flexslider plugin -->
<script type="text/javascript">
$(document).ready(function($) {
$('.flexslider').flexslider({
animation: "fade",
prevText: "",
nextText: "",
directionNav: true
});
});
</script>
</body>
</html>