js调试工具推荐firefox的firebug插件 能够给js设置断点执行 能够运行时修改css样式 查看dom模型等 ☆IE8自带的developerbar也很不错 ☆打开firefox所有js警告: 在地址栏里录入:about:config 双击,设置javascriptoptionrestict打开为true能够看到很多警告,利于纠错 ☆IE->firefoxjavascript类 [b]△document.all("id")->document.getElementById("id") [/b]并且控件尽量用id,而不是name标识 提示: 如果控件只有name,没有id,用getElementById时: IE:也可以找到对象 FF:返回NULL [b]△获得form里某个元素的方法 [/b]elForm.elements['name']; [b]△取集合元素时,ie支持[],()2种写法,但是ff仅支持[],如: [/b]table.rows(5).cells(0) 改为: table.rows[5].cells[0] [b]△判断对象是否是object的方法应该为 [/b]if(typeof对象变量=="object") 而不是if(对象变量=="[object]") [b]△eval(对象名称)->document.getElementById [/b]FF支持eval函数 [b]△通过id直接调用对象 [/b]对象id.value="" 改为 document.getElementById("name").value="" [b]△obj.insertAdjacentElement("beforeBegin",objText);[/b] 改为用 obj.parentNode.insertBefore(objText,obj); [b]△FF的createElement不支持HTML代码[/b] 用document.write(esHTML); 或者创建元素后再设置属性,对input元素来说,需要先设置type再加入到dom里 varobj=createElement("input"); obj.type="checkbox"; varobj2=document.getElementById("id2"); obj2.parentNode.insertBefore(obj,obj2); 如果是直接插入html代码,则可以考虑用 createContextualFragment [b]△innerText->textContent[/b] [b]△对象名称中的$不能识别,建议改为_ [/b]objName="t1$spin" 改为 objName="t1_spin" [b]△FF里设置Attribute为某个对象,然后再取出来,这时候对象的属性都丢失了? [/b]objText.setAttribute("obj",obj); alert(obj.id)//正确的名字 obj=objText.getAttribute("obj"); alert(obj.id)//null 在IE下没有问题,FF对setAttribute来说,第2个参数都是字符串型的!!! 所以如果第2个参数是对象时,相当于调用对象的toString()方法了 解决的方法是用下面的调用方式: objText.dropdown_select=obj; obj=objText.dropdown_select [b]△className->class [/b]FF下用class代替IE下的className 由于class是关键字,所以需要用setAttribute/getAttribute才行 setAttribute("class","css样式名称"); [b]△在html里定义的属性,必须用getAttribute才行 [/b]<tdid="TD1"isOBJ="true"> 获取时: document.getElementByID("TD1").isOBJ总返回undefined,IE下是可以的 应该用: document.getElementByID("TD1").getAttribute("isOBJ") [b]△FF里select控件不再是:总是在顶端显示 [/b]所以可能需要设置控件的zIndex IE里覆盖select控件的方法是,用ifame [b]△对于if(vars==undefined)下面的值用于判断是等同的 [/b]undefined null false 0 [b]△如果FF调用obj.focus();报错,请尝试改为: [/b]window.setTimeout(function(){obj.focus();},20); [b]△FF下,keyCode是只读的,那把回车转换为tab怎么办?在录入时进行键值转换怎么办??[/b] 变通的方法是: 1.回车跳转->自己写跳转处理代码. 遍历dom里所有的元素,找到当前元素的下一个能够设置焦点的元素,给其设置焦点 2.在能够录入的控件里, 把选中的部分替换为新录入的内容:vartext=String.fromCharCode(event.keyCode); 同时阻止按键事件上传,调用:event.preventDefault() [b]△<button>会被firefox解释为提交form或者刷新页面??? [/b]需要写标准<buttontype="button"> 或者在onclick="原函数调用();returnfalse;" [b]△在firefox里,document.onfocus里获得不到实际获得焦点的控件? [/b]为什么document.keydown可以呢? [b]△children->childNodes[/b] [b]△sytle.pixelHeight->style.height[/b] [b]△判断函数或者变量是否存在 [/b]if(!("varName"inwindow))varVarName=1; [b]△document.body.clientWidth[/b] <!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN"> 如果html包含上面的语句,则应该用下面的方法获取 document.documentElement.clientWidth [b]△window.createPopup[/b] FF不支持 [b]△document.body.onresize[/b] FF不支持 用window.onresize 注意,页面打开时并不会触发onresize事件?需要在onload里也调用一次才行 [b]△box模型的问题[/b] IE下默认的是content-box为了统一,可用设置: div,td{-moz-box-sizing:border-box;box-sizing:border-box;margin:0;padding:0;} 也可用在文档头加入: <!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Strict//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 但是对IE旧代码影响较大 [b]△注册事件[/b] IE:attachEvent FF:addEventListener("blur",myBlur,false); 第1个参数事件名称不需要带"on" 第3个参数false代表事件传递从事件对象沿dom树往body方向传 [b]△触发事件[/b] IE:obj.fireEvent("onclick"); FF: vare=document.createEvent("Events"); e.initEvent("click",true,false); element.dispatchEvent(event) [b]△在事件处理函数中获得对象句柄[/b] varoThis=this; obj.onfocus=function(evt){ oThis.doOnFocus(evt); } [b]△统一事件处理框架代码[/b] doOnFocus(evt){ evt=evt||window.event; varel=evt.target||evt.srcElement; //后续处理 } [b]△FF不支持onpropertychange事件[/b] 但是FF里可以定义属性的setter方法,如下面的: HTMLElement.prototype.__defineSetter__("readOnly",function(readOnly){ //构造虚拟的event对象 varevt=[]; evt["target"]=this; evt["propertyName"]='readOnly' //onpropertychange函数需要定义evt参数,参考统一事件处理框架代码 if(this.onpropertychange)this.onpropertychange(evt); }); ☆IE->firefoxcss类 [b]△cursor:hand->cursor:pointer[/b] [b]△expressionfirefox不支持[/b] 在IE下expression也非常消耗CPU,所以不应该使用!! 为了达到较好的效果,应该建立自己的expressiontojavascript的处理函数 这样在IE和FF里就都能用了. [b]△FILTERfirefox不支持[/b] filter:Alpha(Opacity=50); 替换为 -moz-opacity:0.5; [b]△text-overflow[/b] 不支持 [b]△transparent[/b] firefox下obj.setAttribute("bgColor","#ffffff")只支持颜色 必须用obj.style.backgroundColor="transparent"才行 [b]△FF下text控件高度与IE不同,统一一下[/b] input[type=text]{ height:20px; } 注意input与[之间不能有空格! [b]△font在IE里不能对body和td等起作用,FF可以[/b] 统一用font-family