博客园_Cauma_分类_JavaScripthttp://feed.cnblogs.com/blog/u/40693/category/185357/rss2012-05-29T22:33:35Zfeed.cnblogs.comhttp://www.cnblogs.com/bluedream2009/archive/2011/07/02/2096309.htmlUnderscore骨骼上次写过一篇QWrap骨骼的文章，个人认为，想要了解一个库或框架，首先从他的核心思想入手，理解其思想，那么剩余的就仅仅是方法的堆砌。近年比较火的一个jsMVC框架backbone他的核心强依赖库为underscore。抽空提取了一下他的骨骼，其实主要就是他的链式操作的实现，别个剩下的就是具体函数的实现了，当然对于Underscore函数式也是它的最大亮点，可以好好看下函数的实现。<!DOCTYPEhtml><html><head><title>Underscore骨骼</title></head><body>&2011-07-02T07:49:00Z2011-07-02T07:49:00ZBlueDreamhttp://www.cnblogs.com/bluedream2009/http://www.cnblogs.com/bluedream2009/archive/2011/01/11/1933381.htmlHTML5基础模板[代码]2011-01-11T15:47:00Z2011-01-11T15:47:00ZBlueDreamhttp://www.cnblogs.com/bluedream2009/http://www.cnblogs.com/bluedream2009/archive/2011/01/06/1926941.htmlQWrap骨骼记录一下，有时间更新说明。这里只是提取了QW的实现骨架。剔除了selector的query，简单演示了QW的Node包装器以及setterAll/getterOne的实现思路。原理还是比较简单比较好理解。[代码]2011-01-05T16:31:00Z2011-01-05T16:31:00ZBlueDreamhttp://www.cnblogs.com/bluedream2009/http://www.cnblogs.com/bluedream2009/archive/2011/01/05/1925963.htmljavascript函数重载对于javascript函数重载这个概念，参考书籍上多多少少都会提及，也就是从语言角度来说，javascript不支持函数重载，不能够定义同样的函数然后通过编译器去根据不同的参数执行不同的函数。但是javascript却可以通过自身属性去模拟函数重载。书上常见的比较无意义的例子，比如一个计算器函数，如果参数为两个数字，就执行加法运算。如果参数为三个数字，就执行乘法运算这个函数大家最容易想到的实现就是[代码]这个函数看起来没什么不好，但随着需求的增多，if分支就会越来越庞大，而且对应的模式也越来越难看。虽然if对于语言来说没啥不好。但我们可以考虑使用另一个策略来实现这个需求。这就是一个新的函数重2011-01-04T16:15:00Z2011-01-04T16:15:00ZBlueDreamhttp://www.cnblogs.com/bluedream2009/http://www.cnblogs.com/bluedream2009/archive/2010/12/05/1897281.html资源预加载资源预加载可以提升用户体验，如果每次用户打开页面都要加载图片,js,css等资源，会影响用户体验。资源预加载可以一定程度上改善这种情况。我们可以做的是，但第一个页面load完的时候，在用户阅读网页的空隙，把下一个页面所用的资源提前加载过来cache住，这样下个页面就直接读缓存资源了，这样可以一定程度改善用户体验。 那么预加载资源需要解决的主要问题是JS加载过来不会被直接执行，css加载过来不会更改页面样式。这样就会产生很多方案, 这里介绍一种不错的兼容方案:1. IE下用new Image()来加载2. 其余浏览器使用object元素来加载原因new Image().srcdoesn't d2010-12-05T15:31:00Z2010-12-05T15:31:00ZBlueDreamhttp://www.cnblogs.com/bluedream2009/http://www.cnblogs.com/bluedream2009/archive/2010/10/24/1859727.html关于脚本回调jsonP目前被用来作为跨域的首选方案.即用动态创建的script标签去回调后端脚本，然后获取返回值并调用回调函数。但这里面有两个比较遗憾的事情：前端需要和后端提前定义好接口，而且定义接口后，如果前端回调函数要改变名字，那么后端也需要变。（比如串行化，一个接口调用不同的回调函数，那么就更麻烦了）。无法捕获错误信息。 为了处理这两点。从好奇和emu那边看到了一个比较好的解决方案。转载记录一下[代码]【使用方法】[代码]更详细的细节，请参考：http://www.cnblogs.com/muxrwc/archive/2010/08/16/1800784.htmlhttp://www.blogjav2010-10-24T06:11:00Z2010-10-24T06:11:00ZBlueDreamhttp://www.cnblogs.com/bluedream2009/http://www.cnblogs.com/bluedream2009/archive/2010/10/23/1859239.htmljavaScript杂货铺函数分析functionBlock(func,tag){var_r_function=/^function\b\s*([\$\S]*)\s*\(/;var_r_codebody=/[^{]*\{([\d\D]*)\}$/;var_r_params=/[^\(]*\(([^\)]*)\)[\d\D]*/;tag=(tag||'body').toLowerCase();with(func.toString()){return(tag=='body')?replace(_r_codebody,'$1').replace(/^\s*|\s*$/g,&#32010-10-23T10:25:00Z2010-10-23T10:25:00ZBlueDreamhttp://www.cnblogs.com/bluedream2009/http://www.cnblogs.com/bluedream2009/archive/2010/09/02/1816166.htmljavascript16进制颜色转换为RGBfunction parseHexColor(hexColor) { return { r: parseInt(hexColor.slice(1, 3), 16), g: parseInt(hexColor.slice(3, 5), 16), b: parseInt(hexColor.slice(5, 7), 16) };}function parseHexColor1(hexColor) { v...2010-09-02T08:21:00Z2010-09-02T08:21:00ZBlueDreamhttp://www.cnblogs.com/bluedream2009/http://www.cnblogs.com/bluedream2009/archive/2010/09/02/1815422.html嵌套结构的正则匹配var matchRecursive = function () { var formatParts = /^([\S\s]+?)\.\.\.([\S\s]+)/, metaChar = /[-[\]{}()*+?.\\^$|,]/g, escape = function (str) { return str.replace(metaChar, "\\$&"); }; return fun...2010-09-01T16:04:00Z2010-09-01T16:04:00ZBlueDreamhttp://www.cnblogs.com/bluedream2009/http://www.cnblogs.com/bluedream2009/archive/2010/08/23/1806865.htmljavascript delegate函数// Usage:// Target all links with an ID starting with "notice"delegateEvent({nodeName:/^a$/i, id: /^notice/}, 'click', function(){ alert(this.id);});function delegateEvent(props, type, handler) { var ...2010-08-23T15:45:00Z2010-08-23T15:45:00ZBlueDreamhttp://www.cnblogs.com/bluedream2009/http://www.cnblogs.com/bluedream2009/archive/2010/08/21/1805561.htmlIE浏览器探测前端发展至今.浏览器探测可谓是五花八门.这里再记录一个运用IE的条件编译来探测IE浏览器的各版本.这个代码的意图就是.通过while循环.将条件编译写入到div即页面中.然后直接取注释下的这个元素.直到取不到就退出循环. 这样就获得了IE的最终版本.如果不是IE那么就是undefined.原文地址:http://james.padolsey.com/javascript/detect-ie-in-...2010-08-21T15:00:00Z2010-08-21T15:00:00ZBlueDreamhttp://www.cnblogs.com/bluedream2009/http://www.cnblogs.com/bluedream2009/archive/2010/07/30/1788887.htmljavascript个人函数库(beta版)^ _ ^ GameStartDEMO源码<inputtype="button"style="width:120px;height:45px;"id="run"value="演示"/><divid="container"><divid="demo"class="demo">^_^GameStart</div></div><scripttype="text/javascript&qu2010-07-30T08:58:00Z2010-07-30T08:58:00ZBlueDreamhttp://www.cnblogs.com/bluedream2009/http://www.cnblogs.com/bluedream2009/archive/2010/07/25/1784728.html【转载】使用Fiddler提高前端工作效率 (实例篇)在上一篇（介绍篇）中，我们对Fiddler Web Debugger有了简单的接触，也许你已经开始在用Fiddler进行HTTP相关的调试，在这一篇，我们将通过一个实例了解Fiddler的神奇魔法。在我们前端开发的日常工作中，发现服务器上某个css/javascript文件有问题，需要修改，那真是家常便饭。通常，我们需要将文件进行修改，然后重新发布再验证，这样就很容易影响到生产环境的稳定性。更普遍...2010-07-25T09:19:00Z2010-07-25T09:19:00ZBlueDreamhttp://www.cnblogs.com/bluedream2009/http://www.cnblogs.com/bluedream2009/archive/2010/07/25/1784724.html【转载】使用Fiddler提高前端工作效率 (介绍篇)1. Fiddler 是什么？Fiddler是用C#编写的一个免费的HTTP/HTTPS网络调试器。英语中Fiddler是小提琴的意思，Fiddler Web Debugger就像小提琴一样，可以让前端开发变得更加优雅。Fiddler是以代理服务器的方式，监听系统的网络数据流动。运行Fiddler后，就会在本地打开8888端口，网络数据流通过Fiddler进行中转时，我们可以监视HTTP/HTTP...2010-07-25T09:14:00Z2010-07-25T09:14:00ZBlueDreamhttp://www.cnblogs.com/bluedream2009/http://www.cnblogs.com/bluedream2009/archive/2010/07/11/1775216.htmljavascript打造跨浏览器事件处理机制由于浏览器兼容的复杂性.打造一个较优的跨浏览器事件处理函数.不是件容易的事情.各大类库也都通过了种种方案去抽象一个庞大的事件机制.使用类库可以比较容易的解决兼容性问题.但这背后的机理又是如何呢? 下面我们就一点点铺开来讲.首先,DOM Level2为事件处理定义了两个函数addEventListener和removeEventListener, 这两个函数都来自于EventTarget接口.[代码]EventTarget接口通常实现自Node或Window接口.也就是所谓的DOM元素.那么比如window也就可以通过addEventListener来添加监听.[代码]移除监听通过removeE2010-07-11T06:31:00Z2010-07-11T06:31:00ZBlueDreamhttp://www.cnblogs.com/bluedream2009/http://www.cnblogs.com/bluedream2009/archive/2010/07/09/1774651.htmljavascript气泡碰撞(Chrome, FF更佳)【实例演示】【程序源码】【说明】程序效率出现了很大瓶颈.需要做的优化还有很多.有时间继续完善.如果IE下在博客演示慢.可将实例下载到本地.另：感谢罗浮宫群友逍遥君武和豪情对图片的支持。【源码下载】screenBubble2010-07-09T15:07:00Z2010-07-09T15:07:00ZBlueDreamhttp://www.cnblogs.com/bluedream2009/http://www.cnblogs.com/bluedream2009/archive/2010/07/06/1772467.htmljavascript淘宝评星简版【实例演示】你对我人品的评价:20406080100【程序源码】这个效果主要体现在CSS和javascript的配合上CSS代码HTML结构Javascript代码【源码下载】TB-Star2010-07-06T13:44:00Z2010-07-06T13:44:00ZBlueDreamhttp://www.cnblogs.com/bluedream2009/http://www.cnblogs.com/bluedream2009/archive/2010/07/04/1770893.htmljavascript图片360&#176;旋转点击演示程序源码<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml"><head><title>ImageRotation</title><metahttp-equiv="Content-Type&quot2010-07-04T08:45:00Z2010-07-04T08:45:00ZBlueDreamhttp://www.cnblogs.com/bluedream2009/http://www.cnblogs.com/bluedream2009/archive/2010/07/04/1770824.htmljavascript简易动画类【实例演示】【程序源码】【使用方法】【源码下载】fx2010-07-04T05:29:00Z2010-07-04T05:29:00ZBlueDreamhttp://www.cnblogs.com/bluedream2009/http://www.cnblogs.com/bluedream2009/archive/2010/07/03/1770599.htmljavascript简易编辑器程序原理富文本编辑器具有的基本功能就是对编辑区选中的文字通过工具栏提供的功能对文字或选区进行操作.比如文字加粗,斜体,创建表格,插入链接和图片等一系列的操作.然后可以通过源码查看查看编辑后产生的源代码.可以先通过Rich-Text_Editing大致了解下实现富文本编辑器的主要技术.这些功能就是我们代码设计的主线.编辑区我们需要一个iframe.并将其designMode属性设置为"on".这个iframe就具备了编辑功能.也是我们实现编辑器的基本容器.动态创建一个iframe代码如下[代码]这里我们创建了一个空白的iframe并将其document文档的designMode设置为"on".然2010-07-03T11:38:00Z2010-07-03T11:38:00ZBlueDreamhttp://www.cnblogs.com/bluedream2009/