- 博客(64)
- 收藏
- 关注
RSS订阅原创 图解react设计理论基础
根据这篇文章翻译总结https://github.com/reactjs/react-basic，通过这篇作者的理论体系我们基本能够推导出react的原型，这才是react的精华所在；我总结的思维导图的形式能够更好的帮助大家理解；如果代码不够清楚请看原文，点击可以可以看大图；大家看图的顺序请按照右上->右下->左上->左下的顺序，这样才能由浅入深，循循渐进的理解![react设计思想]<>(http
2016-09-05 22:46:57
8027
原创 最小化渲染组件
这篇文章我们主要聚焦在组件的渲染方法上，在上篇文章中,我们采用了innerHTML渲染组件，但是频繁更新组件的话，由于reflow,repaint等原因，页面的性能会下降，同时输入框的焦点也会丢失。最理想的方式就是哪些数据变化，我们更新哪块view,并且从外表上看还是整个区域全部更新。目前解决这个问题的方式有Virtual Dom和MVVM.
2015-03-24 19:19:25
7378
原创 基于唯一状态的前端组件开发
facebook的react的框架提出了一个基于唯一状态来渲染前端组件的想法，什么是唯一状态，采用唯一状态渲染到底有什么好处。希望大家看到这篇文章以后不用任何框架也可以写出基于唯一状态渲染的前端组件。
2015-03-13 17:49:05
3177
原创 理解javascript中的MVVM开发模式
MVVM的全称是Model View ViewModel，这种架构模式最初是由微软的MartinFowler作为微软软件的展现层设计模式的规范提出，它是MVC模式的衍生物，MVVM模式的关注点在能够支持事件驱动的UI开发平台，例如HTML5,[2][3]WindowsPresentation Foundation (WPF),Silverlight 和 tZK framework，Ad
2012-08-12 12:53:57
30877
原创 深入理解JavaScript MVC 框架
Model–View–Controller (MVC)是一种把信息展现逻辑和用户交互分离的计算机用户界面开发模式；Model包含应用的数据和业务逻辑；Controller负责把用户的输入，转换为命令传递给Model和View;这是维基百科的解释； 这种模式最初是由Trygve Reenskaug在使用Smalltalk-80(1979)工作时设计的，刚开始叫做Model-Vi
2012-08-10 18:01:10
25091
4
原创 ios上safari的事件模型(一)
safari在desktop端和mobile端大部分的功能都是一样，我们重点说下差别在什么地方，以及这些差别所引起的问题。我们知道ios在mobile端增加了触摸的功能，触摸功能肯定要用到手指的操作，这个是和desktop端有很大区别的。当我们用手指操作的时候，可能用到一个手指，两个手指或者多个手指，同时手指触摸到不同的dom元素会引起什么不同的行为，我们主要围绕这些问题展开。名词解释：
2012-07-29 18:10:47
10320
原创 使用canvas绘制股票图【envision.js】
最近的一个小项目需要用到一些财经图表，如股票图，净值曲线图，投资组合饼图等。按照产品的要求，这些图表需要在移动设备【手机，平板电脑】和pc端良好运行。我们都知道在ios设备上没法运行flash，所以必须把使用flash开发的方案放弃，只能转向采用javascript开发，最新的移动设备上的浏览器对javascript支持越来越好，同时用于图形图像开发的canvas属性在这里也支持良好。
2012-07-28 23:03:45
11029
4
原创 移动web app开发-----application cache 离线缓存（进阶）
通过上面的两篇文章，application cache的应用和原理，我们应该能够全面了解application cache了。同时我们也能够清楚application cache在设计上有哪些不尽仁义的地方。这篇文章我们主要来了解下application cache在各个浏览器的支持情况和存储大小，以及有哪些坑爹的地方，以及如何解决这些坑爹的地方。app cache在存储大小的
2012-07-04 23:33:51
9042
原创 移动web app开发-----application cache 离线缓存原理篇
上篇文章中写了appcache的manifest文件如何书写，appcache的类型和状态，下面我们通过这篇文章来学习下appcache的下载和更新机制。浏览器自动更新1.假如入我们要访问一个网站的主页，它的html标签有个manifest属性。2.页面从服务器端返回，包括动态资源和静态资源，同时静态资源会采用浏览器常规的缓存方式缓存起来。3.当浏览器解析页面时，发现他
2012-06-05 22:59:49
10712
原创 移动web app开发-----application cache 离线缓存应用篇
在移动web app应用中，请求数非常昂贵，请求数过多不但耗电，耗流量，同时速度也非常的慢，为了减少请求，加快资源的加载速度，使用application cache，是一个比较不错的方案,下面通过三篇文章来全面的介绍application cache，第一篇为应用篇，第二篇为原理篇，第三篇为高级进阶篇。本篇内容主要包括三个方面manifest文件书写application cache类
2012-05-27 22:54:39
13033
1
原创 移动web app开发-----调试篇
俗话说‘工欲善其事必先利其器’，那么在写这个移动端web app开发的系列文章之前，为了让大家少走一些弯路，先来给大家介绍一下我们常用在开发过程中所使用的调试工具。 相信大家进行过web开发开发的人对于一些常用的调试工具都比较熟悉了。在firefox上，firebug了算是最流行的，还有它的很多插件，像yslow等；在chrome我们可以从‘菜单----->工具------>开
2012-05-21 22:10:00
15373
原创 重新拾起csdn的博客
今天无意间看到了我csdn的博客，发现上篇博客的发布时间是2010年12月9号，到今天为止整整一年时间没有发布博客了，有些内疚，有些失落。这一年我的工作发生了一些变化，我的人生也发生了一些变化。 在搜狐的这一年的时间，我总共参与了搜狐微博运营，搜狐创新项目的开发，技术上没有太大的进步，主要是一些杂七杂八的事，真的过的有点浑噩。 技术上主要对html5的相关技
2011-12-09 23:33:54
4149
原创 JavaScript中in操作符
定义：<br />in操作符用来判断某个属性属于某个对象，可以是对象的直接属性，也可以是通过prototype继承的属性。(参见hasOwnProperty)注意事项：<br />n 对于一般的对象属性需要用字符串指定属性的名称如：var mycar = {make: "Honda", model: "Accord", year: 1998};"make" in mycar // returns true"model" in mycar // returns true<br /> <br
2010-09-27 22:23:00
22587
原创 说说jQuery UI 1.8的组件体系特点
jQuery以其良好的api设计在前端开发中造成了极大的影响力，他们的“write less do more”这个宗旨得到了充分的体现，但是他的UI库又是一个怎么样的体系结构呢，他们的UI库的api设计的怎么样呢？我还是通过一段伪代码，来演示下如何来写一个jQuery UI组件： (function($) {//私有变量和方法这里是代码$.widget("ui.dial
2010-03-29 22:09:00
8884
1
原创 说说Yui2.0组件体系特点
在前端开发中，我们实际用到最多的要算容器之类的组件了，在这次本系列的研究框架api的可用性过程中，我就从yui2.0的container模块着手逐一分析该模块总的组件，并指出其api设计的优劣，欢迎大家拍砖。 下面是该模块的整体的架构图： 该模块是位于YAHOO.widget包下，主要包括以下一个类：这些类的简单介绍：Module：主要定义了模块化组件的最基本的结
2010-03-27 22:24:00
4171
原创 为ie中不支持的元素添加样式
在html5即将来临之际，ie下有很多html中元素不支持，如果在其他浏览器下为不支持的元素添加样式是没有问题，但是在ie 下添加样式没有效果，这个问题困扰了我很久，今天终于有答案了，在此小记一下： 大家只需要在页面的开始添加下面一小段代码就行了，例如我要为ie6中不支持的nav元素添加样式，现在我在head标签 中加入下面的代码：
2010-03-10 21:35:00
5375
原创 你真的了解html吗？--之meta标签介绍
Meta data元数据，何为元数据，根据百度百科的解释为：data about data (关于数据的数据)。网页中的元数据主要用来描述关于文档（而不是文档内容）的一些信息。 网页中的元数据主要一下几种方式来指定：1.在文档中通过meta标签来制定；2.在文档外通过link标签来指定；3.通过head元素的profile属性来制定。 这边笔记中主要来说meta元素，Mate中都
2009-12-30 00:09:00
5684
原创 你真的了解html吗？--之script标签介绍
一．属性：src：该属性指定外部JavaScript文件的地址，可以跨域。如果指定了该属性，那么script标签中的内容就会被忽略。 type：指定所使用的脚本语言，可以覆盖默认的脚本语言（即在中定义的脚本类型）开发者必须指定该属性，该属性没有默认值。 language：（不赞成使用），指定script标签的内容所使用的脚本语言，该属性的值是一些语言的标示符，但是由于语言的
2009-12-28 21:10:00
7629
1
原创 百度有啊前端框架分析(自定义事件)
今天早晨从酒店出来，外面下着鹅毛大雪，我的妈呀，我来的时候只穿了一件秋衣，昨天晚上好像所有的天气预报都没有报告今天会下雪，我操，我们的天气预报的仙人们天天在那里说的跟真的一样，这不是骗人吗，但是也没有办法，只能自己想办法怎么能事自己变得更暖和些。 JavaScript中的事件也是如此，浏览器内置的事件不可能帮你把所有的事情都做了，因此遇到特殊事件，必须我们自定义
2009-11-05 23:36:00
3763
原创 百度有啊前端框架分析（浏览器内置事件）
事件是JavaScript中非常重要的一个内容，在百度有啊的前端框架中主要对事件分成了浏览器内置事件和自定义事件两部分。BBEvent下主要对浏览器内置事件进行了标准化。target ：事件目标对象BBEvent.target = function(A) { A = A || window.event; return A.target || A.srcEle
2009-10-28 22:29:00
1670
原创 百度有啊前端js框架分析（一）
Normal 0 7.8 磅 0 2 false false false MicrosoftInternetExplorer4 <!--
2009-10-27 23:39:00
2639
2
转载 Web安全工具大汇聚
很多，非常多。Test sites / testing groundsSPI Dynamics (live) – http://zero.webappsecurity.com/Cenzic (live) – http://crackme.cenzic.com/Watchfire (live) – http://demo.testfire.net/Acunetix (live
2009-10-08 20:50:00
4580
2
原创 如何最快的加载外部JavaScript文件
当标签位于html文档流中的时候,位于后面的html会被阻止渲染，必须等到该script加载完以后才会后面的html才会渲染，通过JavaScript动态的生成一个script标签，可以避免上面你的这个问题，因为这个会是外部加载的script的文件位于html文档流以外。因此动态的加载外部的JavaScript文件可以提高页面的渲染速度，提高用户体验。 最佳实践Steve So
2009-07-31 23:54:00
1386
原创 Xpath in JavaScript (第三部分【IE浏览器中对xpath的支持】)
在前面的两篇文章中主要就firefox,safari,opera,chrome浏览器中对DOM Level 3 XPath的实现进行介绍。IE8还没有实现DOM Level 3 XPath中定义的接口，但是它对xpath也有一定的支持，IE中的xpath功能主要对xml文档可用，对document的对象不可用。 在IE中生成xml文档的方法：function c
2009-06-16 21:36:00
3586
原创 Xpath in JavaScript (第二部分【命名空间】)
在上一篇文章中，我们介绍了在Firefox, Safari, Chrome, and Opera支持的DOM Level 3 XPath，但是我们没有谈关于命名空间在Xpath中的解决方案。如果你只是使用xpath在html文档中简单的查询，evaluate（）中的命名空间解析器参数一般为null,如果你倾向于使用xpath在包含命名空间的xml文档中查询，那么你应该学会怎样创建和
2009-06-15 22:03:00
1313
原创 Xpath in JavaScript (第一部分)
Xpath现在很少被我们使用，因为JSON现在很盛行。可是在XML做为数据交换格式的年代，Xpath在我们随机访问大的xml文档结构的时候扮演着非常重要的位置。也许大家现在很多没有注意到，DOM Level 3 XPath指定的接口已经被Firefox,Safari, Chrome, and Opera实现了。他们所实现的核心接口就是XPathEvaluator，它包含一些能够使用x
2009-06-14 22:32:00
2240
原创 XPath in JavaScript(xpath简介)
XPath 是一门在 XML 文档中查找信息的语言。XPath 可用来在 XML 文档中对元素和属性进行遍历。XPath 是 W3C XSLT 标准的主要元素，并且 XQuery 和 XPointer 同时被构建于 XPath 表达之上。因此，对 XPath 的理解是很多高级 XML 应用的基础。 选取节点：XPath 使用路径表达式在 X
2009-06-14 00:37:00
1834
原创 正则表达式中一些常见的使用方式
匹配HTMLtag/]+) >/匹配HTML linkvar str=;var rel=/href/s*=/s*(?:/"([^/"]*)/"|/([^/]*)/|([^//"/>/s]+))/gi;rel.test(str);alert(RegExp.$1); 匹配url中的文件名匹配对称的括号去除文本首尾的空白字符 今天先写到这里
2009-04-23 22:02:00
703
原创 学好正则表达式两个最重要的规则
正则表达式这个话题实在太大了，但它确实也太重要了，如果作为一个专业的程序员不能很好的掌握它，那么我们就不能算一个合格的程序员。也许你可以随便找一个程序员问他，你会正则表达式吗？你懂正则表达式吗？你用过正则表达式吗？我们得到的回答绝大多数回事肯定的，但是如果你问他你知道正则表达式是怎么运行的嘛？正则表达式在不同的编程语言中有什么不同呢？我敢肯定没有几个人能够正确的回答出来。因此我们不能只限
2009-04-23 21:23:00
1053
3
原创 secrets of the javascript Ninja(Function Type)(javascript忍者的秘密)
大多数情况下，typeof就可以完成检查函数类型的工作，例如：function ninja(){}alert(typeof ninja); 但是根据浏览器的不同，我们可以发现以下集中情况在firefox2和firefox3中，如果检测一个类型的元素，将会检测出来是一个function无标题文档<!--window.onload=function(){
2009-03-30 22:25:00
1104
翻译 secrets of the javascript Ninja( javascript Timer)(javascript忍者的秘密)
javascript中定时器是如何工作的 计时器（定时器）是一个大家常常不能够充分理解，并且常常被误用的JavaScript的特性之一，使用计时器能够开发非常复杂的动态效果，它具有在一段时间后异步执行一段代码的能力，由于JavaScript天生是单线程的，但是使用计时器能够打到异步执行一段代码的能力。 从根本上理解定时器是如何工作的是非常重要的，由于它是单线程运作
2009-03-29 23:36:00
143
翻译 secrets of the javascript Ninja( with(){} 的用法)(javascript忍者的秘密)
with语句也是一个功能强大的特性，但是它常常不能被正确的理解。它允许你把一个对象的所有属性放到with语句所指定的作用域中，这样这些属性就可以想平常的JavaScript变量被使用。理解with语句是如何工作的，在你开发中会带来很大的好处。 JavaScript中with(){}语句是如何工作的让我们首先通过一个小例子来看看with(){}语句的基本用法： var u
2009-03-25 22:26:00
2306
翻译 secrets of the javascript Ninja (Function Prototypes)(javascript忍者的秘密)
函数原型有很多用途,比如可以用来向一个函数实例上添加一些属性，但是它的一个最主要用途是使JavaScript能够以面向对象的方式编程。实例化和原型（Instantiation 和 prototypes）所有函数默认的都会有一个含有空对象的prototype属性，它的这个特性只有在实例化后才会有用，为了能够理解它的这种特性是多么的重要，需要知道一个重要的原则：函数具有双重功能，
2009-03-24 22:01:00
1815
1
原创 元素的ID慎用length
先来看看一段错误的代码：无标题文档<!--(function(){//id=length var d=document.getElementsByTagName("input").length; alert(d);})();// --> 这段代码中第一个input的ID为length,我们可以在Ie,firef
2009-03-17 16:47:00
930
原创 javascript浏览器兼容性(不断更新中)
ajax必用对象XMLHttpRequestie7 必须是onreadystatechange ie6必须是onReadyStateChangeie6 必须用xmlhttp 的activex对象 ie7和ff可以用new XMLHttpRequest 直接创建ie6 的xmlhttp不是真正的js对象 所以它的 成员函数 this 都跟js对象不一样事件兼容性
2009-03-14 23:25:00
602
原创 java中容器介绍(List,Set,Map)
线性表，链表，哈希表是常用的数据结构，在进行Java开发时，JDK已经为我们提供了一系列相应的类来实现基本的数据结构。这些类均在java.util包中。本文试图通过简单的描述，向读者阐述各个类的作用以及如何正确使用这些类。 Collection ├List │├LinkedList │├ArrayList │└Vector │ └Stack └Set Map ├Hashtable ├Hash
2009-03-11 22:19:00
1382
1
原创 java面试题集锦（不断更新中）
Collection 和 Collections的区别。Collections是个Java.util下的类，他提供一系列静态方法实现对各种集合的搜索、排序、线程安全化等操作。Collection是个java.util下的接口，它是各种集合结构的父接口。ArrayList和Vector的区别。同步性:Vector是线程安全的，也就是说是同步的，而ArrayLi
2009-03-11 21:57:00
823
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人