随笔分类 -  javascript

上一页 1 2
js 心得
Array 的方法们 和 object 那些让人纠结的问题 ......
摘要：昨天 一个朋友 问了这样一个问题. 本来类似的代码测试,以前做过好多... 但发现当我试图从根源上找出原因的时候,却有些无所适从. 特记录下来,待以后求证.简单的问题 :var con = function(){};var a = con.prototype = [];var obj = new con;obj.push(1);alert(obj[0]);alert(obj.length); //ie 6 7 8(8怪异模式下) 输出0 , ie8标准模式 以及 ie9 和其他浏览器 输出1 在ie 下 1 被 push 到哪去了.显然在push中 浏览器都有 this[this.length 阅读全文
posted @ 2010-11-12 16:27 Franky 阅读(2543) 评论(12) 推荐(0)
ie6 ie7 userdata 本地存储 引发的惨案.
摘要：我使用 documentElement 作为userdata 作为本地存储的载体.document.documentElement.addBehavior("#default#userdata");悲剧就产生了.当使用mootools 的 选择器方法 时. 如果很悲剧的 使用了不恰当的选择符.比如$$('[attr=123]');就报错了. 为什么呢？查看 mootools 源码 发现 他的选择器在遍历所有节点时 简单的使用了下面的逻辑 :getProperty: function(attribute){ var key = attributes[attri 阅读全文
posted @ 2010-10-25 18:38 Franky 阅读(4717) 评论(4) 推荐(2)
为什么要避免硬编码 注册事件... 再次老生常谈一下 事件注册的方式.
摘要：对于这个话题 以前我有写过 一篇 随笔 地址 是 ：http://www.cnblogs.com/_franky/archive/2009/03/23/1420029.html以前那篇没有说透彻的东西 今天详细的 说一说. 看 代码 :<button id ="btn1" onclick="do something ....">按钮</button>对于这个东西 以前说的更... 阅读全文
posted @ 2010-07-20 16:35 Franky 阅读(3633) 评论(22) 推荐(2)
又说 动态加载 script. ie 下 script Element 的 readyState状态
摘要：事实 上 说这个话题 有点老生常谈..但是因为涉及到更多 并行加载脚本的 思考 所以 还是觉得可以写一下.为了 脚本资源的高并行加载 提高页面加载速度.. 我们可能需要动态加载 script... 其中总是无法避免的 一个方法 是 使用 head.appendChild(script) ; 因为这种方式 可以直接跨域.但是有时候 动态加载脚本可能是要保证 他们的执行时序. 最理想的状态就是 所有... 阅读全文
posted @ 2010-06-20 13:59 Franky 阅读(10050) 评论(10) 推荐(4)
ajax 请求 的一些残念
摘要：本文是篇真正的随笔 是我在写一份前端优化ppt时 想到哪写到哪 产生的一份 罗里吧嗦的 东东...有点懒的整理 ...所以就发布到这个旮旯吧.Ajax 优化一 . 给被请求资源设置有效的长远的 Expires 的同时设置一个相对短 且合理的 max-age值比如 对某一文件 服务器的响应头 中应该包含Expires: Tue, 01 Jun 2030 15:43:46 GMT Cache-Cont... 阅读全文
posted @ 2010-06-04 09:50 Franky 阅读(1222) 评论(4) 推荐(2)
各浏览器 使用 script defer 的差异.
摘要：过时的东西.不讨论也罢. 回头整理下新的东东. 阅读全文
posted @ 2010-05-11 04:31 Franky 阅读(2015) 评论(3) 推荐(1)
浏览器中 for in 反射 对象成员 的差异
摘要：我们知道 众浏览器的js引擎 在 for in 反射 某对象成员时 是一次性获该对象的 比如var obj={a:1};for (var o in obj){obj={a:1,b:2};}整个for 循环 只会执行一次 及时我们再循环内部改变了obj 的引用 但是 反射对象始终是 in后面那个obj的原始引用 .也可以称作 for in 缓存了被反射对象.但是我们看看另外一种情况var obj={a:1};var i=0;for (var o in obj){obj.b=2;i++;}alert(i);这里 浏览器出现了不一致性. 非ie浏览器 打印 1 而 ie 则打印2…再说顺序问题 :I 阅读全文
posted @ 2010-05-08 13:51 Franky 阅读(2132) 评论(4) 推荐(2)
浏览器中的 正则表达式陷阱
摘要：js 内置对象 RegExp 我们用的很习惯 也很舒服 但是里面却有 严重的隐患 或者陷阱...原因在于 有些浏览器 对正则表达式直接量的优化.在本章开始前 我要引入一个例子 来说明这种不彻底的 变态的优化 到底合理还是不合理...c# 中的 字符串直接量 做的优化 就非常彻底...这种优化我们应该是欢迎的...string str="franky";string str2="franky";在内存中 只有一份 字符串对象 而str和str2 具备相同的一份引用. 很明显 这非常合理.string n = "franky", n2 = 阅读全文
posted @ 2010-05-02 02:29 Franky 阅读(4094) 评论(7) 推荐(4)
跨浏览器的 mouseenter mouseleave 以及 compareDocumentPosition
摘要：昨天去 大牛 司徒正美 的blog 看博文 突然看到关于 onmouseenter 和onmouseleave 两个ie专有事件..写了这么久 js应用 我居然不知道这两个事件 于是 去google搜索了一番. 才发现这两个事件 是如此的优秀 且好用... 但搜索过程中 发现 好多人 似乎不太明白这两个事件 和mouseover mouseout 真正的区别 和用途.. 并且看到google中搜索得到的一些朋友 实现的 跨浏览器 解决方案. 觉得似乎有些繁琐...所以产生了写一篇blog 把这玩意 说透彻的冲动... 好啦.我们进入正题.对于 mouseover 和mouseenter 两个事 阅读全文
posted @ 2010-05-01 16:20 Franky 阅读(3624) 评论(5) 推荐(0)
浏览器中的 window.setInterval 和window.setTimeout
摘要：2个计时器方法的异同...如果期望多次回调 某方法 出于性能考虑 应使用 setInterval出于 稳定 回调间隔考虑 应使用setTimeout方法 如var timer;function f(){if(条件) clearInterval(timer)//注 clearTimeout clearInterval 都可以清除 setTimeout和setInterval 产生的时间戳对象setTimeout(f,间隔时间)}使用setTimeout 应吧该语句放到 当前上下文环境 的最后一行 调用 以便获取可靠的 时间间隔..原因是setTimeout(function(){dosometh 阅读全文
posted @ 2010-04-30 22:55 Franky 阅读(3788) 评论(0) 推荐(0)
从浏览器的focus blur说起
摘要：焦点事件 对于提高用户体验 无疑是有着 至关重要的作用... 但是使用他的同时 往往也会 给我们带来一些困扰...先说个 借助焦点 解决一个 弹出菜单 的问题 的另类方案.以往我们对于 弹出式菜单的 关闭 有以下几个方案.1. 当鼠标离开当前div时 菜单即隐藏 或者 setTimeout 隐藏 如果 鼠标及时的回到菜单上 清除setTimeout的计时器.2. 注册document.onclic... 阅读全文
posted @ 2010-04-28 02:57 Franky 阅读(6437) 评论(4) 推荐(4)
js call和apply的 模拟逻辑实现.
摘要：Function.prototype.Apply = function(obj, arr) { obj = obj || window; obj._tempFunction = this; var rv; if (!arr) rv = obj._tempFunction(); else { var args = []; for (var i = 0, len = arr.length; i <... 阅读全文
posted @ 2010-04-07 00:38 Franky 阅读(1090) 评论(0) 推荐(1)
jquery css() 方法的分析 于bug .
摘要：bug 描述 当 element 的 css font-size:100% 此类百分比值的时候 我们将得到的是个错误的值 而这个值是什么呢？ 也许大家猜到了。 是的 就是父容器的 clientWidth*这个百分比 之所以会这样的原因是 因为 他的代码如下:if(elem.currentStyle){//r=elem.currentStyle [ styleString];//取到相应css属性的最终渲染值if ( !/^\d+(px)?$/i.test( ret ) && /^\d/.test( ret ) ) {var left = style.left, rsLeft = elem.ru 阅读全文
posted @ 2009-11-29 12:29 Franky 阅读(3065) 评论(2) 推荐(0)
opera9.6 的一个顽固的bug
摘要：在叙述之前 先说下 万幸 这个bug opera10已经修复了divElement是一个 div元素 默认样式 width:100px;border-width:0:window.setTimeout(function() { divElement.style.borderWidth = '20px'; }, 100);当setTimeout回调 来改变某div的borderWidth的时候 op... 阅读全文
posted @ 2009-11-26 13:56 Franky 阅读(364) 评论(1) 推荐(0)
javascript 关于类型判断的不同方法 和性能的 思考.
摘要：.目前 主流的判断方式 是var obj='franky';return Object.prototype.toString.call(obj)=='object String'; 这种方式..不得不说 这种方式很优秀 除了代码量比较多一些... 但是它在 非ie浏览器中的性能表现十分优秀...有些朋友可能会奇怪 这个不是专门判断是不是 Array的么. 考虑到typeof 返回 object 以... 阅读全文
posted @ 2009-08-17 00:21 Franky 阅读(617) 评论(1) 推荐(3)
webkit 引擎的 bug 以及 safari4 beta版的 严重bug
摘要：前两天 写段脚本 在给某个层加了float以后 忘了去掉 就直接 用脚本更改了 他为绝对定位 position:absolute 然后设置了坐标...再然后 给document对象注册onclick事件 去触发 显示隐藏该层 ... 这样做 safari3 和chrome 就崩溃了 safari4没测试 不知道bug是否依然存在当时发现只要我点鼠标就崩溃 以为是注册事件的问题.. 我取消了注册的document.onclick事件侦听以后手动代码反复调用该层 show hidden 不会崩溃....一筹莫展的时候 突然发现我只要把 该层原来的兄弟div 在html中去掉就不会出现这个问题... 阅读全文
posted @ 2009-04-16 13:24 Franky 阅读(2144) 评论(9) 推荐(0)
IE8 的 又一致命bug 导致崩溃 . 不知道是不是我第一个发现?
摘要：ie8 支持了新的方法 element.querySelectorAll 方法 支持 css2的 选择器 这功能很好很强大 但却有致命问题 他返回的对象 不是象 document.getElementsByName ByTagName 那样 返回的一个 普通的NodeList对象或 ie8叫 [object HTMLCollection] 对象 而是返回一个 叫 [object staticNodeList] 的对象 问题就出在他身上我写了一个 通用的 对象转数组的 方法所以 要判断一下 传入的对象是不是 nodeList 集合对象. 但当传入的对象是 [object HTMLCollecti 阅读全文
posted @ 2009-04-08 14:35 Franky 阅读(4370) 评论(12) 推荐(0)
javascript 中的this 与事件注册 及event
摘要：本文不讨论 语法解释期和执行期的区别 以及上下文环境和闭包的概念 我们只从另一个角度来看问题.js 中的this 是一个指针 他指象某个对象. 那么 一般来说 记住一条原则 即可.如果一个函数不是作为类 来实例化某个对象 如 new func();而是当 函数 做为某个对象的 方法被调用时 则this就指向该对象. 如果该函数是直接被调用 则this指向全局变量...这句话似乎不好理解. 我们看下例子function test(){this.name='franky';}var o={};o.t=test;o.t();//此处test方法是作为 对象o的方法t 被调用的.则 其 阅读全文
posted @ 2009-03-23 21:47 Franky 阅读(6433) 评论(7) 推荐(2)
让ie以及老版本w3c浏览器 也支持ES5的 数组对象的 几个新增方法.
摘要：写了简单注释. 具体用法 请参考 ES5 手册 .// 模拟ES5 Array.prototype.forEach if (!Array.prototype.forEach) { Array.prototype.forEach = function(f, oThis) { if (!f || f.constructor != Function.toString()) return; oThis = oThis || window; for (var i = 0, len = this.length; i < len; i++) { f.call(oThis, this[i], i, th 阅读全文
posted @ 2009-03-11 22:03 Franky 阅读(3129) 评论(11) 推荐(1)

上一页 1 2