JavaScript 学习笔记 Black.Caffeine 09.11.28
更新时间：2009年11月30日 22:20:54 作者：
这两天终于写出了一个个人认为真正意义上的作业了，不过，最大感受就是。。。IE太垃圾了。。。so，这个作业实际上也没有完成的很完美，因为，在IE上还是有兼容性的问题存在，不错，就此先自我总结一下吧~免得以后又忘了~
1. 之前写的一直都是分散的函数，用到什么功能，就写什么函数，觉得不够整洁，所以这次写的是封装的类，用起来还不错，但是传递参数的时候遇到了不少问题，所以，查阅了很多资料，总结如下：
1）动态绑定事件问题：
需要将onclick事件绑定到对象上，比如列表项。需要用到addEventListener或者attachEvent，用于吧函数操作添加到事件中去，而不是覆盖，但是，attachEvent不支持FF，FF只能用addEventListener。so，就需要一个函数，把它们俩给综合起来，于是乎，这个函数诞生了：
function addEventHandler(oTarget, sEventType, fnHandler)
{
if(oTarget.addEventListener)
{oTarget.addEventListener(sEventType, fnHandler, false);}
else if(oTarget.attachEvent)
{oTarget.attachEvent('on' + sEventType, fnHandler);}
else{oTarget['on' + sEventType] = fnHandler;}
}
2）传递this参数问题：
由于我吧函数和属性都封装到了一个类里面，所以在绑定onclick之类的事件是，就会产生一个问题，比如，addEventHandler(this.elems[i],"click",this.Move);，这样就出错了，因为在onclick事件发生的时候，调用的this就不是指向这个封装的类了，于是乎，就需要用到apply()了~——应用某一对象的一个方法，用另一个对象替换当前对象。具体格式我就不用说了，网上一大堆~函数：
var Bind = function(object,func){
var args = Array.prototype.slice.call(arguments).slice(2);
return function(){
return func.apply(object,args);
}
}
调用：
this._fnMove=Bind(this,this.move,i);//this.move是我定义的一个成员函数,封装在类中
//this.elems[i].onclick=this._fnMove;//吧上面那句话换成这句话也是可以的，只不过，onclick事件就被替换为this._fnMove，而不是添加this._fnMove进去
addEventHandler(this.elems[i],"click",this._fnMove);
这样就OK了~
PS.call()也是基本相同的功能，但具体参数不一样
2.setInterval问题
1）与setTimeout的区别
在一般情况下，setTimeout仅执行一次，（当然，如果在一个函数里反复调用setTimeout,就可以重复执行了）而 setInterval是可以重复执行的，直到clearIntercal()
2）在IE下不兼容问题
这个问题折磨了我50%的时间，哦买噶，以后是不是要半生都浪费在跟IE干仗上了。。。
本来，在chrome,ff,safari上都运行的很好，我相当激动，以至于遗忘了IE。。。后来在IE上一试，结果，完了，修改，google（此处为动词，嘿嘿）,基本上花了大半天时间吧，终于搞定。 之前，语句是这样的：this.timer=setInterval(this.unfold,5,this.divs[index],this);结果在IE下完全不好使。最后，在某位大侠的文章里面看到如下描述：在IE下，setTimeout和setInterval是不支持参数传递的.问题很快就解决掉了，果然是我太菜了~
解决问题的函数如下：
var mySetInterval = setInterval;
window.setInterval = function(callback, interval)
{
var args = Array.prototype.slice.call(arguments, 2);
function callFn(){callback.apply(null, args);}
return mySetInterval(callFn, interval);
}
var mySetTimeOut = setTimeout; //修改setInterval
window.setTimeout = function(callback, timeout)
{
var args = Array.prototype.slice.call(arguments, 2);
function callFn(){callback.apply(null, args);}
然后使用window.setTimeout或window.setInterval调用就可以了~
我的语句修改如下：
this.timer=window.setInterval(this.unfold,5,this.divs[index],this); //其中，this.divs[index],this是传递的两个参数
再次谢谢那位大侠，虽然他不认识我~
目前，在IE中还有点排版的小问题，继续学习~全力兔子！
1）动态绑定事件问题：
需要将onclick事件绑定到对象上，比如列表项。需要用到addEventListener或者attachEvent，用于吧函数操作添加到事件中去，而不是覆盖，但是，attachEvent不支持FF，FF只能用addEventListener。so，就需要一个函数，把它们俩给综合起来，于是乎，这个函数诞生了：
复制代码 代码如下:
function addEventHandler(oTarget, sEventType, fnHandler)
{
if(oTarget.addEventListener)
{oTarget.addEventListener(sEventType, fnHandler, false);}
else if(oTarget.attachEvent)
{oTarget.attachEvent('on' + sEventType, fnHandler);}
else{oTarget['on' + sEventType] = fnHandler;}
}
2）传递this参数问题：
由于我吧函数和属性都封装到了一个类里面，所以在绑定onclick之类的事件是，就会产生一个问题，比如，addEventHandler(this.elems[i],"click",this.Move);，这样就出错了，因为在onclick事件发生的时候，调用的this就不是指向这个封装的类了，于是乎，就需要用到apply()了~——应用某一对象的一个方法，用另一个对象替换当前对象。具体格式我就不用说了，网上一大堆~函数：
复制代码 代码如下:
var Bind = function(object,func){
var args = Array.prototype.slice.call(arguments).slice(2);
return function(){
return func.apply(object,args);
}
}
调用：
this._fnMove=Bind(this,this.move,i);//this.move是我定义的一个成员函数,封装在类中
//this.elems[i].onclick=this._fnMove;//吧上面那句话换成这句话也是可以的，只不过，onclick事件就被替换为this._fnMove，而不是添加this._fnMove进去
addEventHandler(this.elems[i],"click",this._fnMove);
这样就OK了~
PS.call()也是基本相同的功能，但具体参数不一样
2.setInterval问题
1）与setTimeout的区别
在一般情况下，setTimeout仅执行一次，（当然，如果在一个函数里反复调用setTimeout,就可以重复执行了）而 setInterval是可以重复执行的，直到clearIntercal()
2）在IE下不兼容问题
这个问题折磨了我50%的时间，哦买噶，以后是不是要半生都浪费在跟IE干仗上了。。。
本来，在chrome,ff,safari上都运行的很好，我相当激动，以至于遗忘了IE。。。后来在IE上一试，结果，完了，修改，google（此处为动词，嘿嘿）,基本上花了大半天时间吧，终于搞定。 之前，语句是这样的：this.timer=setInterval(this.unfold,5,this.divs[index],this);结果在IE下完全不好使。最后，在某位大侠的文章里面看到如下描述：在IE下，setTimeout和setInterval是不支持参数传递的.问题很快就解决掉了，果然是我太菜了~
解决问题的函数如下：
复制代码 代码如下:
var mySetInterval = setInterval;
window.setInterval = function(callback, interval)
{
var args = Array.prototype.slice.call(arguments, 2);
function callFn(){callback.apply(null, args);}
return mySetInterval(callFn, interval);
}
var mySetTimeOut = setTimeout; //修改setInterval
window.setTimeout = function(callback, timeout)
{
var args = Array.prototype.slice.call(arguments, 2);
function callFn(){callback.apply(null, args);}
然后使用window.setTimeout或window.setInterval调用就可以了~
我的语句修改如下：
this.timer=window.setInterval(this.unfold,5,this.divs[index],this); //其中，this.divs[index],this是传递的两个参数
再次谢谢那位大侠，虽然他不认识我~
目前，在IE中还有点排版的小问题，继续学习~全力兔子！
相关文章
JavaScript初级教程(第五课续)...2007-04-04
这篇文章主要介绍了javascript的数组和常用函数详解,非常详细，适合新手学习,需要的朋友可以参考下2014-05-05
这篇文章主要介绍了ECMAscript 变量作用域，通过使用var操作符声明和未使用var操作符声明两种情景做出了解释，具体操作步骤大家可查看下文的详细讲解，感兴趣的小伙伴们可以参考一下。2017-08-08
javascript中apply、call和bind的使用区别
下面小编就为大家带来一篇javascript中apply、call和bind的使用区别。小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2016-04-04
Math对象的一些方法能实现我们课本上的某些数学计算，比较常用的方法有如下几个2010-04-04
在这一章我主要介绍一些用来检测用户输入的代码，利用这些代码，你也可以写一些自己的检测函数。2010-02-02
actionscript是flash的脚本语言，目前已经由adobe公司升级到3.0版本，成为了真正意义的oop语言，JavaScript是由netscape工程师设计完成的一门脚本语言，用于web开发的前端脚本2011-05-05
这篇文章主要介绍了JavaScript中的pow()方法使用详解,是JS入门学习中的基础知识,需要的朋友可以参考下2015-06-06
在JavaScript中，arguments对象是比较特别的一个对象，实际上是当前函数的一个内置属性。下面这篇文章主要介绍了关于Javascript函数中的arguments面貌以及如何转化为数组的相关资料，需要的朋友可以参考借鉴，下面来一起看看吧。2017-02-02
对象是一种复合值，它将很多值（原始值或其他对象）聚合在一起，可通过属性名访问这些值。而属性名可以是包含空字符串在内的任意字符串。JavaScript对象也可以称作一种数据结构2016-07-07
最新评论