JavaScript操作DOM的那些坑

问题三：

其余参照：http://segmentfault.com/a/1190000002559158#articleHeader11

参照表

(+为支撑，-为不支撑)：

x/y：W3C- IE+ Firefox- Opera+ Safari+ chrome+

layerX/layerY：W3C- IE- Firefox+ Opera- Safari+ chrome+

pageX/pageY：W3C- IE- Firefox+ Opera+ Safari+ chrome+

clientX/clientY：W3C+ IE+ Firefox+ Opera+ Safari+ chrome+

screenX/screenY：W3C+ IE+ Firefox+ Opera+ Safari+ chrome+

查看下方DEMO：

你会发明offsetX在Firefox下是undefined，在chrome和IE则会正常显示。

PS：IE 中的所有 DOM 对象都是以 COM 对象的情势实现的，这意味着 IE 中的 DOM可能会和其他浏览器有必定的差别。

https://jsfiddle.net/f4am208m/embedded/result/

2.w3c应用addEventListener来为事宜元素添加事宜监听器，而IE则应用attachEvent。addEventListener为事宜冒泡到的当前对象，而attachEvent是window

offsetLeft和style.left差别

1.style.left返回的是字符串，比如10px。而offsetLeft返回的是数值，比如数值10

2.style.left是可读写的，offsetLeft是只读的

3.style.left的值须要事先定义(在样式表中定义无效，只能取到在html中定义的值)，不然取到的值是空的

getComputedStyle与currentStyle

getComputedStyle()接收两个参数：要取得盘似揭捉?式的元素和一个伪元素，如不雅不须要伪元素，则可所以null。然而，在IE中，并不支撑getComputedStyle，IE供给了currentStyle属性。

缺点:在标准浏览器中正常，但在IE6/7/8中不支撑

window.onload=function(){ 
 
    var oBtn=document.getElementById('btn'); 
 
    var oDiv=document.getElementById('div1'); 
 
  
 
    oBtn.onclick=function(){ 
 
        //alert(oDiv.style.width); //写在样式表里无法攫取，只能获得写在行内的 
 
        //alert(getComputedStyle(oDiv).width); //实用于标准浏览器       IE6、7、8不辨认 
 
        //alert(oDiv.currentStyle.width); //实用于IE浏览器，标准浏览器不辨认 
 
        if(oDiv.currentStyle){ 
 
            alert(oDiv.currentStyle.width); 
 
        }else{ 
 
            alert(getComputedStyle(oDiv).width); 
 
        } 
 
  
 
    }; 
 
};

撤消表单提交

<script type="text/javascript"> 
 
    function listenEvent(eventObj,event,eventHandler){ 
 
        if(eventObj.addEventListener){ 
 
            eventObj.addEventListener(event,eventHandler,false); 
 
        }else if(eventObj.attachEvent){ 
 	
			 2/10   首页 上一页 1 2 3 4 5 6 下一页 尾页	
			

　　推荐阅读
　　利用卷积自编码器对图片进行降噪
            【技巧沙龙】AI开辟者拭魅战营-7分钟打造1个定制技能。7月22号，我们等你一路！

            这周工作太忙，本来想更把 Attention tranlsation 写出来，但一向抽不出时光，等后面有时光再来写。我们这>>>详细阅读


本文标题：JavaScript操作DOM的那些坑
地址：http://www.17bianji.com/lsqh/36299.html
 1/2    1