前端开发提高之旅
文章平均质量分 83
提供前端开发由浅入深的学习指南
产品经理读书会
为爱读书的产品人提供书籍推荐、读书交流、以书会友的环境,欢迎爱读书的产品人分享读书感悟、找寻改变世界之路
展开
-
前端编程提高之旅(十八)----移动端web流行交互技术方案研究
在停止实习后,生活最大变化在于没有项目的压力,可以根据兴趣场景,探索技术实现。这个过程对于个人来说,动力自内而外,需求自上而下,都由个人把握。 生活在移动互联网井喷的今天,同时又关注前端技术,平常对微信端流行的交互(或者说玩法)有着特殊的敏感性。如果说之前接触MVC框架还是对单页面网站、CSS3前沿特效有一个概念的话,微信朋友圈及好友分享网页,则把国内网页构建的流行趋势,从幕后推向前台。原创 2014-12-20 21:03:09 · 1682 阅读 · 0 评论 -
前端编程提高之旅(十七)----jquery中表单、表格和ajax
从一个框架核心功能层面上说,实现了选择器、DOM操作、事件、动画,功能已经完备了。而任何框架写出了就是应用的,所以这篇涉及的表单与表格知识,虽在DOM操作中有所涉及,但更偏于实际项目中的应用技巧的使用。ajax部分的内容更是前端与后端交互的核心。 一、jQuery中的表单与表格应用 实际项目中,表单和表格分别扮演采集、提交用户输入的信息和显示列表的数据。在HTML中非常重要。下面是原创 2014-12-13 10:31:50 · 1998 阅读 · 0 评论 -
前端编程提高之旅(十六)----jquery中的动画
上一篇文章对jquery中的事件做了总结,这篇文章主要对jquery中的动画做一下总结归类。最近微信端分享中,有很多页面交互及动画做的非常受欢迎,非常符合移动端体验。看似花哨的动画从本质上都脱离不了编写动画的基本方法。乐帝将jquery动画部分内容,做了一个简单的归类。 如下图: 如上图所示,无论多复杂的动画,从实现上都采用这些最底层的动画方法。本篇将从动画方法和与动画原创 2014-11-28 23:08:18 · 1672 阅读 · 1 评论 -
前端编程提高之旅(十五)----jquery事件
HTML与js交互主要通过用户与浏览器操作页面时引发事件。文档或某些元素发生某些变化或操作时,浏览器会生成事件。jquery增加了事件处理能力。 jquery事件部分可以从以下五部分理解: 一、加载DOM函数 这里指的如下方法: $(document).ready(function(){ }) 相比于传统的window.onload方法,前者在执行时原创 2014-11-27 23:22:46 · 1045 阅读 · 0 评论 -
前端编程提高之旅(十四)----jquery DOM操作
正如乐帝在《招聘后台投递设置联动按钮迭代开发总结》提到web前端js开发分为页面间通信、页面内交互、后端接口存取数据的操作。对于一个页面开发核心在于对DOM的操作。别忘了网页从历史上和本质上来说都是在线的文档而已。DOM操作是对文档的操作,自然而然就成为网页js开发的核心了。 传统上来说,DOM操作分为三类:DOM core、HTML-DOM、CSS-DOM。DOM co原创 2014-11-23 11:05:09 · 1245 阅读 · 0 评论 -
前端编程提高之旅(十三)----jquery选择器
Jquery代表javascript和query,即对javascript查询操作的类库,jquery是web前端界的事实标准。最近读《锋利的jquery》,发现这本书最大特点是,更深层的讨论一些jquery使用情境和优化方法,对于有一定jquery使用经验的开发者有独特价值。本篇算是乐帝读此书,对选择器和DOM操作加深理解的总结。 javascript自身包含三大弊端:复杂的原创 2014-11-22 11:36:31 · 1402 阅读 · 1 评论 -
前端编程提高之旅(十二)----position置入值应用
这次内推项目用到的遮罩及其页面下方按钮都涉及一个概念position置入值得概念。效果图如下: 一个元素position属性不是默认值static,那么该元素被称为定位元素。定位的元素生成定位框,其定位基于四个特性(置入值):'top','right','bottom','left'。 现在的问题在于当置入值在声明与原创 2014-11-14 16:58:57 · 1546 阅读 · 0 评论 -
前端编程提高之旅(十一)----jquery代码的组织
最近做内推项目,虽然项目不算太大,还是遇到了一些代码组织的问题,说到底还是对整个项目的掌控力不够,为此乐帝专门在网络中搜集了一些jquery代码组织的文章并总结出两种方法来更好组织jquery代码。 一、回调函数 回调函数的定义: A callback is a function that is passed as an argument to another functi原创 2014-11-14 15:53:04 · 2522 阅读 · 0 评论 -
前端编程提高之旅(十)----表单验证插件与cookie插件
实际项目开发中与用户交互的常见手法就是采用表单的形式,取得用户注册、登录等信息。而当用户注册或登录后又需要记住用户的登录状态。这就涉及到常用的两个操作:表单验证与cookie增删查找。 项目开发当然可以手动或用原生代码解决以上两个问题,而最好的实践应该是站在巨人的肩膀上,从合理性推测角度和不重复造轮子的原则上,都应该对成熟的技术,实行拿来主义,更加快速、高效、稳定的将精力放在项目逻辑实现原创 2014-11-14 11:17:46 · 1882 阅读 · 0 评论 -
前端编程提高之旅(九)----延迟对象
近日做内部推荐项目,在进入项目首页时,需要进行预调用接口判断,按照以往的习惯,应该将调用接口后执行的代码,放入ajax请求success内执行。这样当然可以,但是代码组织和可读性都没有那么高。通过查看Jquery官网api发现了deferred object(延迟对象)这个概念。 一、API文档的翻译: 延迟对象,在jquery1.5被引入,是调用jQuery.Deferred原创 2014-11-14 09:37:22 · 5544 阅读 · 1 评论 -
前端编程提高之旅(八)----D3.js数据可视化data join解析
D3.js作为一门轻型的可视化类库,非常便于将数据与web界面元素绑定,实现可视化。乐帝d3.js入门是大体看了一遍《d3js数据可视化实战》这本书,D3操作非常类似于jquery的使用,具体体现在两点:选择器模块都采用CSS3标准方法可以链式调用 有了jquery使用基础,相信再加上以上书籍的例子,调试很容易上手使用D3.js,乐帝目前认为D3.js与jquery区别在于:D原创 2014-10-23 20:16:58 · 7941 阅读 · 1 评论 -
前端编程提高之旅(七)----marionette实现todoMVC
marionetteJS是在backboneJS基础上进行更简洁的操作,平常开发主要用到几个涉及到view的概念:CollectionView、CompositeView、ItemView、LayoutView。这几个概念中,用的最广的当属ItemView。ItemView相对于backbone中view的概念方便之处在于:不用显式定义render方法,而是由ItemView本身完成将数据渲染到模板,并将视图追加到el,由此可见减少了很多流程化的操作。原创 2014-10-17 23:06:19 · 6839 阅读 · 1 评论 -
前端编程提高之旅(六)----backbone实现todoMVC
乐帝当年学习backbone时,最开始是看官网todoMVC的实现,后来了解到requireJS便于管理JS代码,就对官网代码做了requireJS管理。但此时乐帝感觉此时的todoMVC仍然不够简明,为了加深对MVC架构的理解,乐帝对原有appview代码进行了重构,将相关显示模块单独提取出自称view,实现view原子化。乐帝已经将这个项目上传(下载地址)。 加入requireJ原创 2014-10-11 16:46:59 · 5455 阅读 · 1 评论 -
前端编程提高之旅(五)----写给大家看的css书
自实习也有几个月的时间了,以爱奇艺实习为敲门砖,进入了目前这家公司。如果说当初能进爱奇艺是临时突击DIV+CSS的话,目前在这家公司体验到,任何技术都必须悉知原理,这样才能做到庖丁解牛,做一个内行的人。css属性和用法都摆在那里,但如果用得好,除了躬身实践,提高理论积淀就特别必要了,这本《写给大家看的css书》快速扫过一遍之后,之前工作遇到过不清楚的问题,一扫而空,所以有必要总结下。 cs原创 2014-10-06 14:10:55 · 2008 阅读 · 1 评论 -
前端编程提高之旅(四)----backbone初体验
来到新的实习单位,公司的业务模式、组织架构、开发技术、开发规范对于乐帝这样的职场菜鸟来说都是新的,这一周入职的这几天主要在熟悉公司采用的前端架构,前端架构基本包括:backbone、marionette、requirejs。由于乐帝在爱奇艺实习期间,自学了PHP技术,对smarty模板及thinkphp框架有一个了解,接触前端MVC还是有点基础的。 公司有一套专业的前端培训流程清单。这周主原创 2014-08-30 22:06:02 · 4573 阅读 · 0 评论 -
前端编程提高之旅(三)----浏览器兼容之IE6
在爱奇艺实习期间,乐帝主要负责移动端活动页面的制作,由于移动浏览器是随着智能手机兴起的,这就决定了移动端不会重蹈浏览器兼容问题的覆辙,一开始就比较好的支持web标准,而纵观整个互联网行业,移动web开发还处于起步阶段,在很长一段时间pc端web作为主要的服务形式还会继续。从小来说作为一名前端开发人员,不了解浏览器兼容也会贻笑大方。这篇文章基于《IE7web标准之道》,对浏览器兼容做一个概览。原创 2014-08-20 18:18:05 · 2277 阅读 · 0 评论 -
前端编程提高之旅(二)----网站常见特效的jquery实现
最好的编程语言是逻辑,前端各种交互特效的实现多可以用jquery实现,特效可以纷飞,内在逻辑则基本不变。这一篇文章主要介绍jquery实现常见特效背后的逻辑。 1.通过类名获取元素集合 首先来看一个js原生代码不支持的方法,通过类来获取元素集合。document.getElementsByClassName=function(classname){ var retno原创 2014-08-09 23:11:11 · 4524 阅读 · 0 评论 -
前端编程提高之旅(一)----插件
平日收集有价值的网页颇多,而收集资料并不是一件快乐的事情,反而越多越给内心压力,困扰自己的同时,也错失了提高的时机。因此此系列文章意在探讨前端的编程所感,亦是疏解内心压力,自我提高的途径。此偏文章涉及内容均来自网友博客。 示例一:bar#time_back{width:300px;height:20px;border:1px solid #246;backgroun原创 2014-07-10 17:22:55 · 1963 阅读 · 0 评论