ThinkChat2.0新版上线,更智能更精彩,支持会话、画图、阅读、搜索等,送10W Token,即刻开启你的AI之旅 广告
<div class="view-body think-editor-content"><h4 id="1-">1. 各大公司开源项目</h4> <ul><li><a href="https://code.facebook.com/projects/web/">Facebook Projects</a></li><li><a href="http://fex.baidu.com/">百度web前端研发部</a></li><li><a href="http://efe.baidu.com/">百度EFE</a></li><li><a href="https://github.com/fex-team/">百度github</a></li><li><a href="http://www.alloyteam.com/">alloyteam</a></li><li><a href="http://alloyteam.github.io/">alloyteam-github</a></li><li><a href="https://github.com/AlloyTeam/AlloyGameEngine">alloyteam-AlloyGameEngine</a></li><li><a href="http://alloyteam.github.io/AlloyDesigner/">AlloyDesigner</a> 即时修改,即时保存,设计稿较正,其它开发辅助工具</li><li><a href="http://www.alloyteam.com/2015/06/h5-jiao-hu-ye-bian-ji-qi-aeditor-jie-shao/">H5交互页编辑器AEditor介绍</a> H5动画交互页开发的工具介绍</li><li><a href="http://aeditor.alloyteam.com/">AEditor</a> H5动画交互页开发的工具</li><li><a href="http://forum.maka.im/wordpress/">maka</a></li><li><a href="https://github.com/fenbility/weekly-feed">值得订阅的weekly</a></li><li><a href="http://cube.qq.com/">腾讯html5</a></li><li><a href="http://75team.github.io/">奇舞团开源项目</a></li><li><a href="http://ued.qunar.com/">Qunar UED</a></li></ul> <h4 id="2-javascript">2. Javascript</h4> <ol><li> <p>常用 </p> <ul><li><a href="http://www.zhangxinxu.com/wordpress/2013/12/iebetter-js-make-ie6-ie8-like-modern-browser-ie9-chrome/">ieBetter.js-让IE6-IE8拥有IE9+,Chrome等浏览器特性</a></li><li><a href="http://mottie.github.io/Keyboard/">模拟键盘</a></li><li><a href="https://github.com/hotoo/pinyin">拼音</a></li><li><a href="https://github.com/mc-zone/IDValidator">中国个人身份证号验证</a></li></ul> </li><li> <p>算法</p> <ul><li><a href="https://github.com/Ralph-Wang/algorithm.in.js">数据结构与算法 JavaScript 描述. 章节练习</a></li><li><a href="https://github.com/twobin/twobinSort">常见排序算法(JS版)</a></li><li><a href="https://github.com/luofei2011/jsAgm/blob/master/js/sort.js">经典排序</a></li><li><a href="https://github.com/hechangmin/jssort">常见排序算法-js版本</a></li><li><a href="https://github.com/lightningtgc/JavaScript-Algorithms">JavaScript 算法与数据结构 精华集</a></li><li><a href="http://www.nowcoder.com/live/courses">面试常考算法题精讲</a></li></ul> </li><li> <p>移动端</p> <ul><li><a href="https://github.com/ftlabs/fastclick">fastclick</a></li><li><a href="https://github.com/mmastrac/jquery-noclickdelay">no-click-delay</a></li></ul> </li><li> <p>JSON</p> <ul><li><a href="http://beta.json-generator.com/">模拟生成JSON数据</a></li><li><a href="http://jsonp.afeld.me/">返回跨域JSONAPI</a></li></ul> </li></ol> <h4 id="3-html5">3. Html5</h4> <ul><li><a href="http://www.zhihu.com/question/24398907">HTML5 有哪些让你惊艳的 demo?</a></li><li><a href="http://jo2.org/html5-canvas-tutorial-list/">html5 Canvas画图系列教程目录</a></li></ul> <h4 id="4-css">4. CSS</h4> <ul><li><a href="http://browserhacks.com/">browserhacks</a></li></ul> <h4 id="5-jquery">5. jQuery</h4> <ol><li> <p>焦点图</p> <ul><li><a href="https://github.com/koen301/myfocus">myfocus</a></li><li><a href="http://www.chhua.com/myfocus/">myfocus-官方演示站</a></li><li><a href="http://www.superslide2.com/">SuperSlidev2.1 -- 大话主席</a></li><li><a href="http://www.bujichong.com/sojs/soChange/index.html">soChange</a></li></ul> </li></ol> <h4 id="6-ext-easyui-j-ui-ui-">6. Ext, EasyUI, J-UI 及其它各种UI方案</h4> <ol><li> <p>Ext</p> <ul><li><a href="https://www.sencha.com/products/extjs/">extjs</a></li><li><a href="http://docs.sencha.com/extjs/4.0.7/">ext4英文api</a></li><li><a href="http://extjs-doc-cn.github.io/ext4api/">ext4中文api</a></li></ul> </li><li> <p>EasyUI</p> <ul><li><a href="http://jquery-easyui.googlecode.com/svn/trunk/src/">jquery easyui 未压缩源代码</a></li></ul> </li><li> <p>J-UI</p> <ul><li><a href="http://www.j-ui.com">J-UI</a></li></ul> </li><li> <p>Other</p> <ul><li><a href="http://dcloudio.github.io/mui/">MUI-最接近原生APP体验的高性能前端框架</a></li><li><a href="http://amazeui.org/">Amaze UI | 中国首个开源 HTML5 跨屏前端框架</a></li><li><a href="http://m.sui.taobao.org/">淘宝 HTML5 前端框架</a></li><li><a href="http://docs.kissyui.com/">KISSY - 阿里前端JavaScript库</a></li><li><a href="http://nej.netease.com/">网易Nej - Nice Easy Javascript</a></li><li><a href="http://demos.telerik.com/kendo-ui/mvvm/index">Kendo UI MVVM Demo</a></li><li><a href="http://www.bootcss.com/">Bootstrap</a></li><li><a href="http://smartui.chinamzz.com/">Smart UI</a></li><li><a href="http://developer.yahoo.com/yui/grids/">雅虎UI - CSS UI</a></li></ul> </li></ol> <h4 id="7-">7. 页面 社会化 分享功能</h4> <ul><li><a href="http://share.baidu.com/">百度分享</a> pc端</li><li><a href="http://jiathis.com/">JiaThis</a> pc端</li><li><a href="http://developer.baidu.com/soc/share">社会化分享组件</a> 移动端</li><li><a href="http://www.mob.com/#/index">ShareSDK 轻松实现社会化功能</a> 移动端</li><li><a href="http://dev.umeng.com/social/android/quick-integration">友盟分享</a> 移动端</li></ul> <h4 id="8-">8. 富文本编辑器</h4> <ul><li><a href="http://ueditor.baidu.com/website/">百度 ueditor</a></li><li><a href="http://ckeditor.com/">经典的ckeditor</a></li><li><a href="http://kindeditor.net/">经典的kindeditor</a></li><li><a href="http://www.bootcss.com/p/bootstrap-wysiwyg/">wysiwyg</a></li><li><a href="http://integ.github.io/BachEditor/">一个有情怀的编辑器。Bach's Editor</a></li><li><a href="https://github.com/mycolorway/simditor">tower用的编辑器</a></li><li><a href="https://github.com/summernote/summernote">summernote 编辑器</a></li><li><a href="http://neilj.github.io/Squire/">html5编辑器</a></li><li><a href="http://lab.hustlzp.com/XEditor/">XEditor</a></li><li><a href="https://github.com/wangfupeng1988/wangEditor">wangEditor</a></li><li><a href="http://alex-d.github.io/Trumbowyg/">Trumbowyg - 轻量编辑器</a></li></ul> <h4 id="9-">9. 日历</h4> <ol><li> <p>PC</p> <ul><li><a href="http://www.my97.net/dp/demo/index.htm">经典my97</a></li><li><a href="http://www.cnblogs.com/gbin1/archive/2012/04/16/2452105.html">强大的独立日期选择器</a></li><li><a href="http://arshaw.com/fullcalendar/">fullcalendar</a></li><li><a href="http://blog.csdn.net/francislaw/article/details/7740630">fullcalendar日历控件知识点集合 </a></li><li><a href="http://blog.sina.com.cn/s/blog_9475b1c101012c5f.html">中文api</a></li><li><a href="https://github.com/zzyss86/LunarCalendar">农历日历</a></li><li><a href="http://www.sucaisj.com/jiaoben/date/201509/16856.html">超酷的仿百度带节日日历老黄历控件</a></li><li><a href="http://momentjs.com/">日期格式化</a></li><li><a href="https://github.com/Johnqing/QPAYCalendar/">大牛日历控件</a></li><li><a href="https://github.com/Iamlars/dateMarker">我群某管理作品</a></li><li><a href="http://digitalbush.com/projects/masked-input-plugin/">input按位替换-官网</a></li><li><a href="https://github.com/digitalBush/jquery.maskedinput/tree/1.2.2">input按位替换-github</a></li><li><a href="https://github.com/dangrossman/bootstrap-daterangepicker">bootstrap-daterangepicker</a></li><li><a href="http://www.vandelaydesign.com/30-best-free-jquery-plugins/">国外30个插件集合</a></li><li><a href="http://dbushell.com/2012/10/09/pikaday-javascript-datepicker/">JavaScript datepicker</a></li><li><a href="http://jonthornton.github.io/Datepair.js/">Datepair.js</a></li><li><a href="https://github.com/glad/glDatePicker">一个风格多样的日历</a></li><li><a href="http://amsul.ca/pickadate.js/date/">弹出层式的全日历</a></li><li><a href="http://www.daterangepicker.com/">jquery双日历</a></li></ul> </li><li> <p>移动</p> <ul><li><a href="http://www.frankdemo.cn/index.php?c=content&amp;a=show&amp;id=115">大气实用jQuery手机移动端日历日期选择插件</a></li><li><a href="https://mobiscroll.com/">jQuery Mobile 移动开发中的日期插件Mobiscroll </a></li></ul> </li><li> <p>Date library</p> <ul><li><a href="https://github.com/datejs/Datejs">Datejs</a></li><li><a href="http://sugarjs.com/api/Date">sugarjs</a></li></ul> </li></ol> <h4 id="10-">10. 综合效果搜索平台</h4> <ul><li><a href="http://www.jq22.com">效果网</a></li><li><a href="http://www.17sucai.com/">17素材</a></li><li><a href="http://microjs.com/">常用的JavaScript代码片段</a></li></ul> <h4 id="11-">11. 前端工程化</h4> <ol><li> <p>概述</p> <ul><li><a href="http://www.awesomes.cn/">前端工具大全</a></li><li><a href="https://github.com/fouber/blog/issues/10?from=timeline&amp;isappinstalled=0#">什么是前端工程化</a></li></ul> </li><li> <p>Gulp </p> <ul><li><a href="http://gulpjs.com/">Gulp官网</a></li><li><a href="http://www.gulpjs.com.cn/">Gulp中文网</a></li><li><a href="https://github.com/Platform-CUF/use-gulp">gulp资料收集</a></li><li><a href="http://javascript.ruanyifeng.com/tool/gulp.html">Gulp:任务自动管理工具 - ruanyifeng</a></li><li><a href="http://gulpjs.com/plugins/">Gulp插件</a></li><li><a href="http://www.ido321.com/1622.html">Gulp不完全入门教程</a></li><li><a href="https://github.com/hjzheng/CUF_meeting_knowledge_share/issues/33">为什么使用gulp?</a></li><li><a href="http://www.dbpoo.com/getting-started-with-gulp/">Gulp安装及配合组件构建前端开发一体化</a></li><li><a href="https://github.com/nimojs/gulp-book">Gulp 入门指南</a></li><li><a href="https://github.com/nimojs/blog/issues/19">Gulp 入门指南 - nimojs</a></li><li><a href="http://markpop.github.io/2014/09/17/Gulp%E5%85%A5%E9%97%A8%E6%95%99%E7%A8%8B/">Gulp入门教程</a></li><li><a href="http://www.imooc.com/video/5692">Gulp in Action</a></li><li><a href="http://www.w3ctech.com/topic/134">Gulp开发教程(翻译)</a></li><li><a href="http://www.cnblogs.com/2050/p/4198792.html">前端构建工具gulpjs的使用介绍及技巧</a></li></ul> </li><li> <p>Grunt</p> <ul><li><a href="http://gruntjs.com/">gruntjs</a></li><li><a href="http://www.gruntjs.net/">Grunt中文网</a></li></ul> </li><li> <p>Fis</p> <ul><li><a href="http://fex-team.github.io/fis-site/index.html">fis 官网</a></li><li><a href="http://fis.baidu.com/">fis</a></li></ul> </li><li> <p>webpack</p> <ul><li><a href="https://github.com/webpack/webpack">webpack</a></li><li><a href="http://html-js.com/article/3009">Webpack,101入门体验</a></li><li><a href="http://html-js.com/article/3113">webpack入门教程</a></li><li><a href="http://segmentfault.com/a/1190000003499526">基于webpack搭建前端工程解决方案探索</a></li><li><a href="http://zhuanlan.zhihu.com/FrontendMagazine/20367175">Webpack傻瓜式指南(一)</a></li><li><a href="https://github.com/TJZC/Banyan/wiki/Webpack%E6%8C%87%E5%8D%97">Webpack指南</a></li></ul> </li></ol> <h4 id="12-">12. 轮播图</h4> <ol><li> <p>pc图轮</p> <ul><li><a href="http://www.jsfoot.com/jquery/demo/2011-09-20/192.html">单屏轮播sochange</a></li><li><a href="http://bxslider.com/examples/carousel-demystified">左右按钮多图切换</a></li><li><a href="https://github.com/alvarotrigo/fullPage.js/">fullpage全屏轮播</a></li></ul> </li><li> <p>移动端</p> <ul><li><a href="http://www.swipejs.com/">无缝切换</a></li><li><a href="http://www.idangero.us/swiper">滑屏效果</a></li><li><a href="https://github.com/peunzhang/fullpage">全屏fullpage</a></li><li><a href="https://github.com/qiqiboy/touchslider">单个图片切换</a></li><li><a href="https://github.com/peunzhang/slip.js">单个全屏切换</a></li><li><a href="http://touch.code.baidu.com/examples.html?qq-pf-to=pcqq.group">百度的切换库</a></li><li><a href="https://github.com/peunzhang/iSlider">单个全屏切换</a></li><li><a href="https://github.com/saw/touch-interfaces">滑屏效果</a></li><li><a href="http://baijs.com/tinycircleslider/">旋转拖动设置</a></li><li><a href="http://touchslider.com/">类似于swipe切换</a></li><li><a href="http://www.swiper.com.cn/demo/index.html">支持多种形式的触摸滑动</a></li><li><a href="https://github.com/joker-ye/main/blob/master/wap/index.html">滑屏效果</a></li><li><a href="http://www.superslide2.com/">大话主席pc移动图片轮换</a></li><li><a href="https://github.com/hahnzhu/parallax.js">滑屏效果</a></li><li><a href="https://github.com/yanhaijing/zepto.fullpage">基于zepto的fullpage</a></li><li><a href="http://www.cnblogs.com/plums/archive/2013/01/10/WebApp-fixed-width-layout-of-multi-terminal-adapter-since.html">[WebApp]定宽网页设计下,固定宽度布局开发WebApp并实现多终端下WebApp布局自适应</a></li><li><a href="http://loo2k.com/blog/detecting-wechat-client/">判断微信客户端的那些坑</a></li><li><a href="https://github.com/JefferyWang/nativeShare.js">可以通过javascript直接调用原生分享的工具</a></li><li><a href="http://www.jiathis.com/help/html/weixin-share-code">JiaThis 分享到微信代码</a></li><li><a href="http://fex.baidu.com/blog/2015/05/cross-mobile/">聊聊移动端跨平台开发的各种技术</a></li><li><a href="http://www.zhihu.com/question/29922082">前端自动化测试</a></li><li><a href="http://ajccom.github.io/niceslider/">多种轮换图片</a></li><li><a href="https://mango.github.io/slideout/">滑动侧边栏</a></li></ul> </li></ol> <h4 id="13-">13. 文件上传</h4> <ul><li><a href="http://fex.baidu.com/webuploader/">百度上传组件</a></li><li><a href="https://blueimp.github.io/jQuery-File-Upload/">上传</a></li><li><a href="http://www.hdfu.net/">flash 头像上传</a></li><li><a href="http://www.dropzonejs.com/">图片上传预览</a></li><li><a href="http://elemefe.github.io/image-cropper/">图片裁剪</a></li><li><a href="http://www.shearphoto.com/">图片裁剪-shearphoto</a></li><li><a href="http://www.oschina.net/project/tag/284/jquery-image-tools?lang=0&amp;os=0&amp;sort=view&amp;p=2">jQuery图片处理</a></li></ul> <h4 id="14-select">14. 模拟select</h4> <ul><li><a href="http://aui.github.io/popupjs/doc/selectbox.html">糖饼 select</a></li><li><a href="https://github.com/rmm5t/jquery-flexselect">flexselect</a></li><li><a href="http://loudev.com/">双select</a></li><li><a href="http://select2.github.io/">select2</a></li></ul> <h4 id="15-">15. 取色插件</h4> <ul><li><a href="http://www.jq22.com/plugin/367">类似 Photoshop 的界面取色插件</a></li><li><a href="https://github.com/jquery/jquery-color/">jquery color</a></li><li><a href="http://www.oschina.net/project/tag/287/color-picker">取色插件集合</a></li><li><a href="https://github.com/mattfarina/farbtastic">farbtastic 圆环+正方形</a></li></ul> <h4 id="16-">16. 城市联动</h4> <ul><li><a href="http://www.ijquery.cn/?p=360">jquery.cityselect.js基于jQuery+JSON的省市或自定义联动效果</a></li></ul> <h4 id="17-">17. 剪贴板</h4> <ul><li><a href="https://github.com/zeroclipboard/zeroclipboard">剪贴板</a></li><li><a href="http://zenorocha.github.io/clipboard.js/">clipboard 最新的剪切方案</a></li></ul> <h4 id="18-">18. 简繁转换</h4> <ul><li><a href="https://github.com/BYVoid/OpenCC">简繁转换</a></li></ul> <h4 id="19-grid">19. 表格 Grid</h4> <ul><li><a href="http://facebook.github.io/fixed-data-table/">facebook表格</a></li><li><a href="http://handsontable.com/">类似于Excel编辑表格-handsontable</a></li><li><a href="http://bootstrap-table.wenzhixin.net.cn/">bootstrap-table插件</a></li><li><a href="https://www.datatables.net/">datatables</a></li></ul> <h4 id="20-">20. 在线演示</h4> <ul><li><a href="http://runjs.cn/">js 在线编辑 - runjs</a></li><li><a href="http://jsbin.com/">js 在线编辑 - jsbin</a></li><li><a href="http://codepen.io/">js 在线编辑 - codepen</a></li><li><a href="http://jsfiddle.net/">js 在线编辑 - jsfiddle</a></li><li><a href="http://ideone.com/">java 在线编辑 - ideone</a></li><li><a href="http://code.hcharts.cn/">js 在线编辑 - hcharts</a></li><li><a href="http://jsdm.com/">js 在线编辑 - jsdm</a></li><li><a href="http://sqlfiddle.com/">sql 在线编辑 - sqlfiddle</a></li><li><a href="https://thimble.mozilla.org">mozilla 在线编辑器</a></li></ul> <h4 id="21-">21. 播放器</h4> <ul><li><a href="https://github.com/zmmbreeze/DeadSimpleVideoPlayer">Html5 VideoPlayer</a></li></ul> <h4 id="22-">22. 粒子动画</h4> <ul><li><a href="http://a-jie.github.io/Proton/#example">Proton 烟花</a></li></ul> <h4 id="23-">23. 表单验证</h4> <ul><li><a href="https://github.com/haiercdboy/Validform/blob/master/README.md">Validform</a></li><li><a href="http://formvalidator.net/">formvalidator</a></li><li><a href="http://www.cnblogs.com/wzmaodong/archive/2012/10/15/2724005.html">jQuery formValidator</a></li></ul></div>