永无止境if(live){ Ux & Design & Life }

好久没有更新博客了，忙是第一原因，另外也是自己没有静下心来的思路写点东西了。晚上看到公司有邮件说员工自己的博客要注意考虑博客内容对公司的影响，当然更多的是注意负面影响。不过我还不至于在首页的顶上来一个免责声明：“我只是为支付宝公司工作，但我的说法并不代表官方”，做好自己的本职工作已经不易，还来折腾这些，只能说闲着蛋疼罢了。

今天难得写点技术的东西，因为测试提到一个问题因为一个id没有读取到造成他后台脚本解析报错，可是网站本省却没有报错。研究了一下发现是因为document.getElementById(“id-name”)中的id-name并不存在，代码在解析的时候却没有直接报js错误。深一步发现这段获取对象的js代码是包裹在E.onDOMReady()中的。E.onDOMReady()是我们自己基于YUI框架开发的自己的js框架，这个onDOMReady用法也就是YUI中的YAHOO.util.Event.onDOMReady.

大家都到DOMReady的用法，就是在页面完全加载完全之后执行这个方法内部的函数。而这里的加载完全是指dom和其他代码，并不包括图片的加载。这和onLoad是有区别的，onLoad是要加载完所有内容包括图片。这也是很多人喜欢用domready的一个原因，试想一下sina要是都用onLoad的话，用户可以去打瓶酱油回来再看页面了。

正是这个解析的方式，使得onDOMReady方法内部的代码一定会执行，即便里面有null和undefined的变量出现，页面也不会因此报错，也是框架的容错性需要。虽然不会产生问题，但是良好的代码习惯告诉我们，定义一个变量，最好不要出现null和undefined的情况。

         今天在解决一个IEbug的时候发现：在IE下面的iframe中使用YUI的onDOMReady方法遇到了执行顺序的问题。具体来说，iframe页面中link了2个js文件a.js和b.js。a.js中执行了一段onDOMReady方法，调用a.js中的functionA()和b.js中的functionB();而在页面中这两个js文件是b.js放在a.js的后面被加载进来的。当页面的dom加载完成之后，应该执行functionA和functionB。但是事实上是页面并没有去执行functionB，报错functionB为空。

       var E = Yahoo.util.event;

       E.onDOMReady(

functionA();

functionB();

        );

         有人会说原因很简单，执行a.js中的那段调用b.js中functionB的时候b.js还没有被加载进来。使用window.onload方法就可以解决，但是遗憾的是onload在iframe下也是没有起作用。这个时候为了调试页面，在这段onDOMReady中添加一个alert()之后，页面在报错点击确定之后却正常执行了b.js中的functionB(),这个时候分析觉得是alert延长了页面的加载时间，在alert的同时页面调用了b.js文件。

于是对页面进行改造，把这段onDOMReady代码放在b.js中去执行，就可以解决问题了。从本质上说是由于IE浏览器对iframe中的js加载顺序解析和其他浏览器有所不同。具体不同还不是很清楚，从YUI的文档中也没有提到这点相关信息。希望知道的人可以帮忙解答一下