forked from jserme/123.jser.us
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
744 lines (744 loc) · 39.2 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
<!DOCTYPE html>
<html lang="zh">
<head>
<title>前端导航站 - 前端工程师专用的导航站</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta name="baidu-site-verification" content="77c1c417ca4e5d0fa792494f27c99f06">
<meta name="Keywords" content="前端工程师网站导航，前端工程师网址导航， Feder网址导航，前端导航，前端工程师导航，前端教程，优秀前端工程师聚合">
<meta name="description" content="content">
<meta name="viewport" content="width=device-width,minimum-scale=1,maximum-scale=1,user-scalable=no">
<link href="http://libs.baidu.com/bootstrap/2.3.2/css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body><a href="http://github.com/jserme/123.jser.us" target="_blank" class="ribbon"><img src="http://s3.amazonaws.com/github/ribbons/forkme_right_red_aa0000.png" alt="Fork me on GitHub"></a>
<div class="navbar navbar-inverse">
<div class="navbar-inner">
<div class="container">
<button type="button" data-toggle="collapse" data-target=".nav-collapse" class="btn btn-navbar"><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="./index.html" class="brand">123.jser.us</a>
<div class="nav-collapse collapse">
<ul class="nav">
<li><a href=".">前端导航站</a></li>
<li><a href="https://github.com/jserme/123.jser.us#readme" target="_blank">我要补充</a></li>
<li><a href="http://weibo.com/ihubo" target="_blank">微博反馈</a></li>
<li><a href="javascript:;" data-toggle="feedback">意见&反馈</a></li>
</ul>
</div>
</div>
</div>
</div>
<div class="container">
<div class="tag">
<table cellspacing="0">
<tr>
<td class="header">
<h2> CDN </h2>
</td>
<td class="content">
<ul>
<li><a href="http://developer.baidu.com/wiki/index.php?title=docs/cplat/libs" target="_blank">
<h3>百度CDN </h3>
<p> 百度的CDN公共库，有名点的库都有，国内的，速度很赞 </p></a>
</li>
<li><a href="http://lib.sinaapp.com/" target="_blank">
<h3>sina sae cdn </h3>
<p> 新浪云的CDN </p></a>
</li>
<li><a href="http://cdnjs.com/" target="_blank">
<h3>cdnjs </h3>
<p> 最全的CDN公用库, 速度不是太稳定 </p></a>
</li>
<li><a href="https://developers.google.com/speed/libraries/devguide" target="_blank">
<h3>GoogleCDN </h3>
<p> Google提供的前端资源CDN </p></a>
</li>
</ul>
</td>
</tr>
</table>
</div>
<div class="tag">
<table cellspacing="0">
<tr>
<td class="header">
<h2> HTTP </h2>
</td>
<td class="content">
<ul>
<li><a href="http://www.httpwatch.com/" target="_blank" data-toggle="tooltip" title="集成在IE和Firefox上的监听HTTP和HTTPS的工具">
<h3>httpwatch </h3>
<p> 集成在IE和Firefox上的监听HTTP和H... </p></a>
</li>
<li><a href="https://addons.mozilla.org/zh-CN/firefox/addon/live-http-headers/" target="_blank">
<h3>Live Http Header </h3>
<p> 可以查看到http头 </p></a>
</li>
<li><a href="https://addons.mozilla.org/eu/firefox/addon/6647?lang=en-US" target="_blank">
<h3>HttpFox </h3>
<p> 和HTTPWatch很类似的一个工具 </p></a>
</li>
<li><a href="http://www.fiddler2.com/" target="_blank">
<h3>Fiddler </h3>
<p> 强大的HTTP调试工具 </p></a>
</li>
</ul>
</td>
</tr>
</table>
</div>
<div class="tag">
<table cellspacing="0">
<tr>
<td class="header">
<h2> UI库 </h2>
</td>
<td class="content">
<ul>
<li><a href="http://foundation.zurb.com/" target="_blank" data-toggle="tooltip" title="Foundation 3，由 ZURB 公司开发，号称世界上最先进的响应式前端框架。利用灵活的网格系统可以快速设计出页面布局。更妙的是，网格可以是你所需要的任何尺寸，它很容易适应各种尺寸的屏幕。">
<h3>Foundation 3 </h3>
<p> Foundation 3，由 ZURB 公司开... </p></a>
</li>
<li><a href="http://designmodo.github.io/Flat-UI/" target="_blank">
<h3>FlatUI </h3>
<p> win8样式的UI库 </p></a>
</li>
<li><a href="http://twitter.github.io/bootstrap/" target="_blank">
<h3>Bootstrap </h3>
<p> 程序员网站速成最佳UI库 </p></a>
</li>
</ul>
</td>
</tr>
</table>
</div>
<div class="tag">
<table cellspacing="0">
<tr>
<td class="header">
<h2> 兼容性 </h2>
</td>
<td class="content">
<ul>
<li><a href="http://msdn.microsoft.com/en-us/expression/" target="_blank" data-toggle="tooltip" title="这是为微软自己发布的跨浏览器测试工具，您可以同时查看您的网页在多个浏览器的呈现情况，对页面排版进行直观的比较。">
<h3>Superpreview </h3>
<p> 这是为微软自己发布的跨浏览器测试工具，您可以同... </p></a>
</li>
<li><a href="http://spoon.net/browsers/" target="_blank" data-toggle="tooltip" title="点击你需要测试的浏览器环境，安装插件就可以进行测试了。帮助你测试网页在Safari、Chrome、Firefox和Opera浏览器中是否正常">
<h3>Spoon Browser Sandbox </h3>
<p> 点击你需要测试的浏览器环境，安装插件就可以进行... </p></a>
</li>
<li><a href="http://modernizr.com/" target="_blank" data-toggle="tooltip" title="Modernizr 是一个开源的 JavaScript 库，用于检测用户浏览器的 HTML5 和 CSS3 特性。它使得那些基于用户浏览器的不同（指对新标准支持性的差异）而开发不同级别体验的设计师的工作变得更为简单，让 Web 开发人员可以在现代浏览器中充分利用 HTML5 和 CSS3 的那些先进的特性进行开发，同时又不会牺牲其它不支持这些新技术的浏览器的控制。">
<h3>Modernizr </h3>
<p> Modernizr 是一个开源的 JavaSc... </p></a>
</li>
<li><a href="http://browserhacks.com" target="_blank">
<h3>Browserhacks </h3>
<p> 浏览器hack速查 </p></a>
</li>
</ul>
</td>
</tr>
</table>
</div>
<div class="tag">
<table cellspacing="0">
<tr>
<td class="header">
<h2> 占位图 </h2>
</td>
<td class="content">
<ul>
<li><a href="http://placekitten.com/" target="_blank">
<h3>placekitten </h3>
<p> 占位图 </p></a>
</li>
<li><a href="http://instasrc.com/" target="_blank">
<h3>instasrc </h3>
<p> 又一个占位图 </p></a>
</li>
</ul>
</td>
</tr>
</table>
</div>
<div class="tag">
<table cellspacing="0">
<tr>
<td class="header">
<h2> 原型设计 </h2>
</td>
<td class="content">
<ul>
<li><a href="https://gomockingbird.com/" target="_blank">
<h3>gomockingbird </h3>
<p> 一个快速在Web上进行原型制作的工具 </p></a>
</li>
<li><a href="http://proto.io/" target="_blank" data-toggle="tooltip" title="Proto.io 是一个新的界面原型设计工具，专门针对移动应用程序。基于 Web 的在线环境，可以让你制作流行的 iPhone，iPad，Android 手机或平板电脑，以及任何带有屏幕界面的设备的原型项目。">
<h3>Proto.io </h3>
<p> Proto.io 是一个新的界面原型设计工具，... </p></a>
</li>
</ul>
</td>
</tr>
</table>
</div>
<div class="tag">
<table cellspacing="0">
<tr>
<td class="header">
<h2> 字体 </h2>
</td>
<td class="content">
<ul>
<li><a href="http://beta.typecastapp.com/" target="_blank" data-toggle="tooltip" title="TypeCast让你可以从Fonts.com、TypeKit、FontDeck和Google这些字体供应和商选择字体，而且能非常方便的比较这些字体使用效果。如果你想获得用户对这些字体效果的反馈，只需要发布一个URL就可以了。这样，无需实际购买的字体，直到你已经决定在最终的解决方案。">
<h3>TypeCast </h3>
<p> TypeCast让你可以从Fonts.com、... </p></a>
</li>
</ul>
</td>
</tr>
</table>
</div>
<div class="tag">
<table cellspacing="0">
<tr>
<td class="header">
<h2> 安全 </h2>
</td>
<td class="content">
<ul>
<li><a href="http://xss.codeplex.com/" target="_blank" data-toggle="tooltip" title="x5s 是一款 Fiddler 插件，用于辅助渗透测试人员发现跨站点脚本（XSS）漏洞。">
<h3>X5s </h3>
<p> x5s 是一款 Fiddler 插件，用于辅助... </p></a>
</li>
<li><a href="http://www.websecurify.com/" target="_blank" data-toggle="tooltip" title="Websecurify 是一款开源的跨平台网站安全检查工具，能够帮助你精确的检测 Web 应用程序安全问题。">
<h3>Websecurify </h3>
<p> Websecurify 是一款开源的跨平台网站... </p></a>
</li>
<li><a href="http://www.ict-romulus.eu/web/wapiti/home" target="_blank" data-toggle="tooltip" title="Wapiti 是 Web 应用程序漏洞检查工具。它具有“暗箱操作”扫描，即它不关心 Web 应用程序的源代码，但它会扫描网页的部署，寻找使其能够注入数据的脚本和格式。">
<h3>Wapiti </h3>
<p> Wapiti 是 Web 应用程序漏洞检查工具... </p></a>
</li>
<li><a href="http://code.google.com/p/skipfish/" target="_blank" data-toggle="tooltip" title="Skipfish 是 Google 公司发布的一款自动 Web 安全扫描程序，以降低用户的在线安全威胁。和 Nikto 和 Nessus 等其他开源扫描工具有相似的功能。">
<h3>Skipfish </h3>
<p> Skipfish 是 Google 公司发布的... </p></a>
</li>
<li><a href="https://www.owasp.org/index.php/Category:OWASP_WebScarab_Project" target="_blank" data-toggle="tooltip" title="WebScarab 一个用来分析使用HTTP和HTTPS协议的应用程序框架，通过记录它检测到的会话内容（请求和应答）来帮助安全专家发现潜在的程序漏洞。">
<h3>OWASP WebScarab Project </h3>
<p> WebScarab 一个用来分析使用HTTP和... </p></a>
</li>
<li><a href="http://www.mavitunasecurity.com/communityedition/" target="_blank" data-toggle="tooltip" title="Netsparker Community Edition 是一款 SQL 注入扫描工具，是Netsparker的社区免费版本，提供了基本的漏洞检测功能。">
<h3>Netsparker Community Edition </h3>
<p> Netsparker Community Ed... </p></a>
</li>
<li><a href="http://www.nstalker.com/products/editions/free/" target="_blank" data-toggle="tooltip" title="N-Stalker Web 应用程序安全2012免费版本能够为您的 Web 应用程序清除该环境中大量常见的漏洞，包括跨站脚本（XSS）、SQL 注入（SQL injection）、缓存溢出（Buffer Overflow）、参数篡改 （Parameter Tampering）等等。">
<h3>N-Stalker Free Version </h3>
<p> N-Stalker Web 应用程序安全201... </p></a>
</li>
<li><a href="http://labs.securitycompass.com/exploit-me/" target="_blank" data-toggle="tooltip" title="Exploit-Me 是一套 Firefox 的 Web 应用程序安全测试工具，轻量，易于使用。">
<h3>Exploit-Me </h3>
<p> Exploit-Me 是一套 Firefox ... </p></a>
</li>
</ul>
</td>
</tr>
</table>
</div>
<div class="tag">
<table cellspacing="0">
<tr>
<td class="header">
<h2> 工作流 </h2>
</td>
<td class="content">
<ul>
<li><a href="http://yeoman.io/" target="_blank" data-toggle="tooltip" title="提供了一套强大的工具、库和工作流，可以帮助开发人员快速构建出漂亮的、引人注目的Web应用。">
<h3>Yeoman </h3>
<p> 提供了一套强大的工具、库和工作流，可以帮助开发... </p></a>
</li>
</ul>
</td>
</tr>
</table>
</div>
<div class="tag">
<table cellspacing="0">
<tr>
<td class="header">
<h2> 工具 </h2>
</td>
<td class="content">
<ul>
<li><a href="http://jsperf.com/" target="_blank">
<h3>jspref </h3>
<p> 方便进行JS性能测试，有大量例子 </p></a>
</li>
<li><a href="http://json.parser.online.fr/" target="_blank">
<h3>json parser online </h3>
<p> 在线解析JSON数据的小工具 </p></a>
</li>
<li><a href="http://jsfiddle.net/" target="_blank">
<h3>jsfiddle </h3>
<p> 在线运行、调试、分享代码 </p></a>
</li>
<li><a href="http://gskinner.com/RegExr/" target="_blank">
<h3>RegExr </h3>
<p> 一个用Flex写的在线测试正则的工具 </p></a>
</li>
</ul>
</td>
</tr>
</table>
</div>
<div class="tag">
<table cellspacing="0">
<tr>
<td class="header">
<h2> 微博 </h2>
</td>
<td class="content">
<ul>
<li><a href="http://weibo.com/lifesinger" target="_blank">
<h3>玉伯 </h3>
<p> 国内前端界的前辈 </p></a>
</li>
</ul>
</td>
</tr>
</table>
</div>
<div class="tag">
<table cellspacing="0">
<tr>
<td class="header">
<h2> 性能 </h2>
</td>
<td class="content">
<ul>
<li><a href="https://developers.google.com/speed/pagespeed/insights" target="_blank">
<h3>PageSpeed Insights </h3>
<p> 分析网页的内容来提供网站加载速度优化建议。 </p></a>
</li>
<li><a href="http://www.jiankongmofang.com/" target="_blank">
<h3>监控魔方 </h3>
<p> 用于性能分析和记录的在线工具 </p></a>
</li>
<li><a href="http://tools.pingdom.com/fpt/" target="_blank" data-toggle="tooltip" title="在线检查网站每个元素的加载速度，生成非常详细的测试报告，帮助你轻松优化网站">
<h3>pingdom </h3>
<p> 在线检查网站每个元素的加载速度，生成非常详细的... </p></a>
</li>
<li><a href="http://www.compuware.com.cn/application-performance-management/ajax-performance-testing.html" target="_blank">
<h3>dynaTrace </h3>
<p> web前端性能分析工具 </p></a>
</li>
<li><a href="http://jsperf.com/" target="_blank">
<h3>jspref </h3>
<p> 方便进行JS性能测试，有大量例子 </p></a>
</li>
<li><a href="http://yslow.org/" target="_blank">
<h3>YSlow </h3>
<p> 全面分析网站性能 </p></a>
</li>
<li><a href="http://whichloadsfaster.com/" target="_blank">
<h3>Which Loads Faster </h3>
<p> 在线对比两个网站的速度 </p></a>
</li>
<li><a href="http://www.webpagetest.org/" target="_blank" data-toggle="tooltip" title="能够帮助你测试网站在 IE6-IE9，Chrome，Firefox 等各种浏览器环境下的加载速度。">
<h3>WebPagetest </h3>
<p> 能够帮助你测试网站在 IE6-IE9，Chro... </p></a>
</li>
<li><a href="http://www.showslow.com/" target="_blank" data-toggle="tooltip" title="开源的测试工具，能够测试网站在 YSlow, Page Speed, WebPageTest 和 dynaTrace AJAX Edition 中的情况。">
<h3>Show Slow </h3>
<p> 开源的测试工具，能够测试网站在 YSlow, ... </p></a>
</li>
<li><a href="https://developers.google.com/speed/pagespeed/?hl=zh-CN" target="_blank" data-toggle="tooltip" title="Page Speed 是开源 Firefox/Firebug 插件。网站管理员和网络开发人员可以使用 Page Speed 来评估他们网页的性能，并获得有关如何改进性能的建议">
<h3>PageSpeed </h3>
<p> Page Speed 是开源 Firefox/... </p></a>
</li>
<li><a href="https://browsermob.com/free-website-performance-test" target="_blank">
<h3>Neustar Web Performance </h3>
<p> 简单快速的了解网站的加载速度 </p></a>
</li>
<li><a href="http://msfast.myspace.com/" target="_blank" data-toggle="tooltip" title="Myspace的性能分析工具, 可以分析到页面渲染的各个阶段的时间、CPU和内存的消耗情况，只使用于IE中">
<h3>Myspace Performance Tracke </h3>
<p> Myspace的性能分析工具, 可以分析到页面... </p></a>
</li>
<li><a href="http://loadimpact.com/" target="_blank">
<h3>Load Impact </h3>
<p> 提供在线测试服务，能够生成详尽的测试报告。 </p></a>
</li>
</ul>
</td>
</tr>
</table>
</div>
<div class="tag">
<table cellspacing="0">
<tr>
<td class="header">
<h2> 敏捷 </h2>
</td>
<td class="content">
<ul>
<li><a href="http://yeoman.io/" target="_blank" data-toggle="tooltip" title="提供了一套强大的工具、库和工作流，可以帮助开发人员快速构建出漂亮的、引人注目的Web应用。">
<h3>Yeoman </h3>
<p> 提供了一套强大的工具、库和工作流，可以帮助开发... </p></a>
</li>
<li><a href="http://docs.emmet.io/" target="_blank" data-toggle="tooltip" title="前身是前端开发人员熟知的Zen Coding，一种提供快速编写HTML/CSS代码的方法。和一般的编辑器中使用的“代码片段”概念不同，Emmet使用动态的类似CSS表达式的语法来生成代码，这意味着你不需要自己去编辑并创建固定的代码片段，大大的提高了代码编写效率。">
<h3>Emmet </h3>
<p> 前身是前端开发人员熟知的Zen Coding，... </p></a>
</li>
</ul>
</td>
</tr>
</table>
</div>
<div class="tag">
<table cellspacing="0">
<tr>
<td class="header">
<h2> 文档 </h2>
</td>
<td class="content">
<ul>
<li><a href="http://overapi.com/" target="_blank">
<h3>overapi </h3>
<p> 收集了各种常用的软件的文档 </p></a>
</li>
<li><a href="http://expressjs.jser.us/" target="_blank">
<h3>express中文文档 </h3>
<p> nodejs著名web框架express的中文文档 </p></a>
</li>
<li><a href="http://caniuse.com/" target="_blank">
<h3>caniuse </h3>
<p> 查询最新的各种HTML5兼容情况 </p></a>
</li>
</ul>
</td>
</tr>
</table>
</div>
<div class="tag">
<table cellspacing="0">
<tr>
<td class="header">
<h2> 格式化 </h2>
</td>
<td class="content">
<ul>
<li><a href="http://jsbeautifier.org/" target="_blank">
<h3>jsbeautifier </h3>
<p> 在线Javascript格式化 </p></a>
</li>
<li><a href="http://jslint.com/" target="_blank">
<h3>JSLint </h3>
<p> 在线JS校验工具 </p></a>
</li>
</ul>
</td>
</tr>
</table>
</div>
<div class="tag">
<table cellspacing="0">
<tr>
<td class="header">
<h2> 正则 </h2>
</td>
<td class="content">
<ul>
<li><a href="http://regexpal.com/" target="_blank">
<h3>regexpal </h3>
<p> 一个用JS写的在线正则测试工具 </p></a>
</li>
<li><a href="http://gskinner.com/RegExr/" target="_blank">
<h3>RegExr </h3>
<p> 一个用Flex写的在线测试正则的工具 </p></a>
</li>
</ul>
</td>
</tr>
</table>
</div>
<div class="tag">
<table cellspacing="0">
<tr>
<td class="header">
<h2> 浏览器 </h2>
</td>
<td class="content">
<ul>
<li><a href="http://browserhacks.com" target="_blank">
<h3>Browserhacks </h3>
<p> 浏览器hack速查 </p></a>
</li>
</ul>
</td>
</tr>
</table>
</div>
<div class="tag">
<table cellspacing="0">
<tr>
<td class="header">
<h2> 浏览器插件 </h2>
</td>
<td class="content">
<ul>
<li><a href="https://addons.mozilla.org/en-US/firefox/addon/655" target="_blank">
<h3>View Source Chart </h3>
<p> 以层级方式展示源码 </p></a>
</li>
<li><a href="https://addons.mozilla.org/zh-CN/firefox/addon/live-http-headers/" target="_blank">
<h3>Live Http Header </h3>
<p> 可以查看到http头 </p></a>
</li>
<li><a href="http://getfirebug.com/" target="_blank">
<h3>Firebug </h3>
<p> 没有谁不知道的web开发调试工具 </p></a>
</li>
<li><a href="https://addons.mozilla.org/en-US/firefox/addon/7408" target="_blank" data-toggle="tooltip" title="Firefox上的一个附加组件，当HOST文件改变时可以很快地更新页面而不需要重启浏览器">
<h3>DNS Flusher </h3>
<p> Firefox上的一个附加组件，当HOST文件... </p></a>
</li>
<li><a href="http://www.colorzilla.com" target="_blank" data-toggle="tooltip" title="小巧的颜色工具，有Firefox和Chrome两种插件">
<h3>ColorZilla </h3>
<p> 小巧的颜色工具，有Firefox和Chrome... </p></a>
</li>
</ul>
</td>
</tr>
</table>
</div>
<div class="tag">
<table cellspacing="0">
<tr>
<td class="header">
<h2> 演示 </h2>
</td>
<td class="content">
<ul>
<li><a href="http://www.rvl.io/" target="_blank">
<h3>rvl </h3>
<p> 简洁的在线演示文稿 </p></a>
</li>
</ul>
</td>
</tr>
</table>
</div>
<div class="tag">
<table cellspacing="0">
<tr>
<td class="header">
<h2> 社区 </h2>
</td>
<td class="content">
<ul>
<li><a href="http://jsdo.it/" target="_blank" data-toggle="tooltip" title="jsdo.it 让开发者可以在线编写 JavaScript、HTML5和CSS3代码，能够在社区中相互分享代码。">
<h3>jsdo.it </h3>
<p> jsdo.it 让开发者可以在线编写 Java... </p></a>
</li>
</ul>
</td>
</tr>
</table>
</div>
<div class="tag">
<table cellspacing="0">
<tr>
<td class="header">
<h2> 类库 </h2>
</td>
<td class="content">
<ul>
<li><a href="http://docs.kissyui.com/" target="_blank">
<h3>kissyui </h3>
<p> 由阿里集团前端工程师们创建的一个开源JS类库。 </p></a>
</li>
<li><a href="http://jquery.com" target="_blank">
<h3>jQuery </h3>
<p> 一个用途非常广泛的前端类库 </p></a>
</li>
<li><a href="http://www.sencha.com/" target="_blank" data-toggle="tooltip" title=" Sencha Touch 是一个基于 HTML5 的移动应用开发框架，致力于吸引 HTML5 开发者使用 Sencha Touch 构建在 iPhone、Android 和 BlackBerry 等设备上运行的移动 Web 应用，这些应用效果看起来如同本地应用。改进的 API，完善的文档和教程资料以及可靠的本地集成让 Sencha Touch 2 成为强有力的移动框架竞争者。">
<h3>Sencha Touch 2 </h3>
<p> Sencha Touch 是一个基于 HTM... </p></a>
</li>
<li><a href="http://aralejs.org/" target="_blank" data-toggle="tooltip" title="基于SeaJS和CMD规范，开放、简单、易用的前端解决方案。">
<h3>Arale </h3>
<p> 基于SeaJS和CMD规范，开放、简单、易用的... </p></a>
</li>
</ul>
</td>
</tr>
</table>
</div>
<div class="tag">
<table cellspacing="0">
<tr>
<td class="header">
<h2> 编辑器 </h2>
</td>
<td class="content">
<ul>
<li><a href="http://ideone.com/" target="_blank" data-toggle="tooltip" title="Ideone 是另外一款在线编译和调试工具，支持超过40种编程语言。">
<h3>ideone </h3>
<p> Ideone 是另外一款在线编译和调试工具，支... </p></a>
</li>
<li><a href="http://www.jetbrains.com/webstorm/" target="_blank" data-toggle="tooltip" title="WebStorm 是jetbrains公司旗下一款JavaScript 开发工具。被广大中国JS开发者誉为“Web前端开发神器”、“最强大的HTML5编辑器”、“最智能的JavaSscript IDE”等。">
<h3>WebStorm </h3>
<p> WebStorm 是jetbrains公司旗下... </p></a>
</li>
<li><a href="http://www.vim.org/" target="_blank">
<h3>vim </h3>
<p> 编辑神器 </p></a>
</li>
<li><a href="http://codepad.org/" target="_blank" data-toggle="tooltip" title="codepad 是一款在线编译/解释工具，支持 C,C++,PHP,Perl,Python和Ruby等众多语言。">
<h3>codepad </h3>
<p> codepad 是一款在线编译/解释工具，支持... </p></a>
</li>
<li><a href="http://jsdo.it/" target="_blank" data-toggle="tooltip" title="jsdo.it 让开发者可以在线编写 JavaScript、HTML5和CSS3代码，能够在社区中相互分享代码。">
<h3>jsdo.it </h3>
<p> jsdo.it 让开发者可以在线编写 Java... </p></a>
</li>
<li><a href="http://www.microsoft.com/visualstudio/eng/visual-studio-update" target="_blank">
<h3>Visual Studio </h3>
<p> 微软的强大的编辑器，功能之全 </p></a>
</li>
<li><a href="http://www.sublimetext.com/2" target="_blank">
<h3>Sublime Text 2 </h3>
<p> 新兴编辑器，小而全 </p></a>
</li>
<li><a href="http://docs.emmet.io/" target="_blank" data-toggle="tooltip" title="前身是前端开发人员熟知的Zen Coding，一种提供快速编写HTML/CSS代码的方法。和一般的编辑器中使用的“代码片段”概念不同，Emmet使用动态的类似CSS表达式的语法来生成代码，这意味着你不需要自己去编辑并创建固定的代码片段，大大的提高了代码编写效率。">
<h3>Emmet </h3>
<p> 前身是前端开发人员熟知的Zen Coding，... </p></a>
</li>
<li><a href="https://c9.io/" target="_blank" data-toggle="tooltip" title="Cloud 9 是基于 NodeJS 构建的在线集成开发环境，语法高亮支持 C#, C++, Python, Perl, Ruby, Scala 等等众多常用开发语言。">
<h3>Cloud9 IDE </h3>
<p> Cloud 9 是基于 NodeJS 构建的在... </p></a>
</li>
<li><a href="http://www.aptana.com/" target="_blank">
<h3>Aptana </h3>
<p> 全面的编辑器 </p></a>
</li>
<li><a href="https://github.com/adobe/brackets/" target="_blank" data-toggle="tooltip" title="Brackets 是 Adobe 的开源 HTML、CSS 和 JavaScript 集成开发环境。Brackets 提供 Windows 和 OS X 平台支持。">
<h3>Adobe Brackets </h3>
<p> Brackets 是 Adobe 的开源 HT... </p></a>
</li>
</ul>
</td>
</tr>
</table>
</div>
<div class="tag">
<table cellspacing="0">
<tr>
<td class="header">
<h2> 调试 </h2>
</td>
<td class="content">
<ul>
<li><a href="http://www.httpwatch.com/" target="_blank" data-toggle="tooltip" title="集成在IE和Firefox上的监听HTTP和HTTPS的工具">
<h3>httpwatch </h3>
<p> 集成在IE和Firefox上的监听HTTP和H... </p></a>
</li>
<li><a href="http://msdn.microsoft.com/en-us/expression/" target="_blank" data-toggle="tooltip" title="这是为微软自己发布的跨浏览器测试工具，您可以同时查看您的网页在多个浏览器的呈现情况，对页面排版进行直观的比较。">
<h3>Superpreview </h3>
<p> 这是为微软自己发布的跨浏览器测试工具，您可以同... </p></a>
</li>
<li><a href="http://codepad.org/" target="_blank" data-toggle="tooltip" title="codepad 是一款在线编译/解释工具，支持 C,C++,PHP,Perl,Python和Ruby等众多语言。">
<h3>codepad </h3>
<p> codepad 是一款在线编译/解释工具，支持... </p></a>
</li>
<li><a href="http://jsdo.it/" target="_blank" data-toggle="tooltip" title="jsdo.it 让开发者可以在线编写 JavaScript、HTML5和CSS3代码，能够在社区中相互分享代码。">
<h3>jsdo.it </h3>
<p> jsdo.it 让开发者可以在线编写 Java... </p></a>
</li>
<li><a href="http://cssdesk.com/" target="_blank">
<h3>cssdesk </h3>
<p> cssdesk 是一个在线调试 CSS 代码的工具。 </p></a>
</li>
<li><a href="http://ideone.com/" target="_blank" data-toggle="tooltip" title="Ideone 是另外一款在线编译和调试工具，支持超过40种编程语言。">
<h3>ideone </h3>
<p> Ideone 是另外一款在线编译和调试工具，支... </p></a>
</li>
<li><a href="http://spoon.net/browsers/" target="_blank" data-toggle="tooltip" title="点击你需要测试的浏览器环境，安装插件就可以进行测试了。帮助你测试网页在Safari、Chrome、Firefox和Opera浏览器中是否正常">
<h3>Spoon Browser Sandbox </h3>
<p> 点击你需要测试的浏览器环境，安装插件就可以进行... </p></a>
</li>
<li><a href="http://jsbin.com/" target="_blank" data-toggle="tooltip" title="JS Bin 是另外一款简洁的在线代码调试工具，能够选择 jQuery、YUI、Dojo、Mootools 和 Backbone等。">
<h3>JS Bin </h3>
<p> JS Bin 是另外一款简洁的在线代码调试工具... </p></a>
</li>
<li><a href="http://www.my-debugbar.com/wiki/IETester/HomePage" target="_blank" data-toggle="tooltip" title="IETester是一个免费的浏览器，它同时包括了IE 5.5、IE 6、IE 7、IE 8的所有内核，多版本IE测试好工具,DIV测试,CSS兼容和各个版本浏览器兼容检测工具">
<h3>IE Teste </h3>
<p> IETester是一个免费的浏览器，它同时包括... </p></a>
</li>
<li><a href="http://www.microsoft.com/en-us/download/details.aspx?id=18359" target="_blank">
<h3>IE Developer Toolbar </h3>
<p> IE低版本浏览器的调试工具 </p></a>
</li>
<li><a href="http://getfirebug.com/" target="_blank">
<h3>Firebug </h3>
<p> 没有谁不知道的web开发调试工具 </p></a>
</li>
<li><a href="http://www.fiddler2.com/" target="_blank">
<h3>Fiddler </h3>
<p> 强大的HTTP调试工具 </p></a>
</li>
<li><a href="https://addons.mozilla.org/en-US/firefox/addon/7408" target="_blank" data-toggle="tooltip" title="Firefox上的一个附加组件，当HOST文件改变时可以很快地更新页面而不需要重启浏览器">
<h3>DNS Flusher </h3>
<p> Firefox上的一个附加组件，当HOST文件... </p></a>
</li>
<li><a href="http://www.my-debugbar.com/wiki/CompanionJS/HomePage" target="_blank" data-toggle="tooltip" title="IE下的js调试工具，需要结合Microsoft Script Debugger使用，通过安装这个工具，但页面出现错误时会在左上角弹出一个小错误提示，点击会在IE下面显示出一个错误控制台，就如FF下的firebug控制台一样，错误信息提示很详细">
<h3>Companion JS </h3>
<p> IE下的js调试工具，需要结合Microsof... </p></a>
</li>
<li><a href="http://browsershots.org/" target="_blank" data-toggle="tooltip" title="BrowserShots 是一款免费的跨浏览器测试工具，捕捉网站在不同浏览器中的截图。这是最有名，也是最古老的浏览器兼容性测试工具。">
<h3>BrowserShots </h3>
<p> BrowserShots 是一款免费的跨浏览器... </p></a>
</li>
<li><a href="http://html.adobe.com/edge/inspect/" target="_blank" data-toggle="tooltip" title="Edge Inspect 是一款对移动开发者非常有用的工具，其前身是 Adobe Shadow，用于帮助设计师和开发者同时在多个移动设备上预览应用设计，发现和解决跨平台问题。">
<h3>Adobe Edge Inspect </h3>
<p> Edge Inspect 是一款对移动开发者非... </p></a>
</li>
</ul>
</td>
</tr>
</table>
</div>
<div class="tag">
<table cellspacing="0">
<tr>
<td class="header">
<h2> 跨平台 </h2>
</td>
<td class="content">
<ul>
<li><a href="http://phonegap.com/" target="_blank" data-toggle="tooltip" title="免费开源的开发框架，让Web开发人员能够使用熟悉的HTML，CSS和JavaScript构建跨平台的移动本地应用。">
<h3>PhoneGap </h3>
<p> 免费开源的开发框架，让Web开发人员能够使用熟... </p></a>
</li>
</ul>
</td>
</tr>
</table>
</div>
</div>
<div class="footer">
<div class="container">
<p> 感谢各种开源项目, 一个程序猿的生活因为你们更美好！</p>
<p> 最后更新于 2013-07-11 19:00:15</p>
</div>
</div>
<script src="http://libs.baidu.com/jquery/1.8.0/jquery.js"></script>
<script src="http://libs.baidu.com/bootstrap/2.3.2/js/bootstrap.min.js"></script>
<script type="text/javascript" src="app.js"></script>
<script type="text/javascript">
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://' : 'http://') + 'hm.baidu.com/h.js?73cf2d97668510747e3153441714c59d';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
</body>
</html>