`

转：IE与DOM事件的区别

 
阅读更多
转自：http://blog.sk80.com/post/281.html
1、获取事件的目标是不一样的 
    位于事件中心对象成为目标(target),假设 元素分配onclick事件处理函数，触发click事件时， 就被认为 是目标
    IE
                var oTarget=oEvent.srcElement; //Masintosh的IE同时支持srcElement和target属性
    DOM
                DOM兼容的游览器上目标包含在target属性中
                var oTarget=oEvent.target;


2、获取字符代码
    IE和DOM都支持event对象的keyCode属性，它会返回按下按键的数值代码。如果按键代表一个字符(非shift,alt,ctrl等) IE的keyCode将返回字符的代码(等于他的unicode码)
            IE
                    var iCharCode = event.keyCode
            DOM
                    在DOM兼容的游览器中，按键的代码和字符会有一个分离，要获取字符代码，使用charCode属性
                    var iCharCode =event.charCode

3、阻止某个事件的默认行为
        IE
                要在IE中阻止某个事件的默认行为，必须将returnValue属性设置为false
                    oEvent.returnValue=false;
       DOM
                    要调用preventDefault()方法
                    oEvent.preventDefault();
                   比如在右击页面的时候可以阻止事件的默认行为,只要阻止contextmenu事件的默认行为就可以了。

4、停止事件的复制(冒泡)
       IE
                    在IE中，要阻止事件的进一步冒泡，必须设置cancelBubble属性为true
                    oEvent.cancelBubble=true;        
       DOM
                    在mozilla中，只需要调用stopPropagation()方法即可
                    oEvent.stopPropagation()
                
                <html onclick="alert('html')">
                    <body onclick="alert('body')">
                        <input type=button value="click" onclick="alert('button')">

                    </body>
                </html>
                点击button会依次出现 button,body,html的提示
                如果增加如下函数，则可阻止事件的复制(冒泡)
                
                function handleClick(oEvent)
                {
                    alert('button');
                    if(window.event)
                    {
                        oEvent=window.event;
                        oEvent.cancelBubble=true;
                    }
                    else
                    {
                        oEvent.stopPropagation();
                    }
                }
                
                <input type=button value="click" onclick="handleClick(event)">
                则只会出现 button的提示
分享到：
| 转：使用Dreamweaver格式化HTML代码
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    IE 下dom查看器

    IE DOM查看器是开发人员在IE环境下调试和优化网页布局、事件处理以及动态内容更新的重要工具。 **描述：“在IE下面DOM查看，很方便，也很容易上手”** 在IE浏览器中，DOM查看器的易用性使得初学者也能快速掌握其...

    IEDevToolBarSetup +IEDOM

    DevToolBar 和 IEDOM 都是Web开发的利器，只要装一个就好了，感觉功能差不多，为了方便起见 一起传上来了。 安装后打开IE浏览器，工具栏中出现箭头（DevToolBar）或查找（IEDOM ）的按钮，点击就可以十分方便的...

    dom-helpers, 小型模块化面向 IE8 的DOM helper 库.zip

    dom-helpers, 小型模块化面向 IE8 的DOM helper 库 dom助手用于 ie8 的微型模块 DOM lib安装npm i -S dom-helpers大多数只是普通的DOM API不一致性的包装器，跨浏览器 工作最小，大多数都是从 jQuery 。 这个库不...

    第三章：javascript-DOM对象模型-补充课件.ppt

    事件处理通常通过`addEventListener`或`attachEvent`（旧版IE浏览器）方法实现。 9. **时间函数的用法**：JavaScript提供了`setTimeout`和`setInterval`函数来定时执行函数，这在实现动态效果如轮播图时非常有用。 ...

    IEdom查看javascript工具

    **IEdom查看JavaScript工具详解** 在Web开发领域，DOM（Document Object Model）是HTML和XML文档的标准表示，它提供了一种结构化的表示方式，使开发者可以方便地通过JavaScript或其他编程语言来操作网页元素。"IE...

    IE DOM Microsoft 浏览器插件

    IE DOM Inspector 是一款 Microsoft 浏览器插件（非开源）。能对动态的HTML DOM 和网页内容进行查看和修改。你能在你的浏览器内直接浏览、拖动、更新动态的HTML DOM。

    IEDevToolBar ie下dom调试

    "暗示IEDevToolBar可能是开发者个人偏好的选择，因为它在功能或用户体验上优于iedom，iedom是另一个用于IE的DOM调试工具。这可能意味着IEDevToolBar提供了更直观的界面、更强大的功能或者更高效的性能。 **...

    IE与Firefox的事件区别

    总结起来，IE和Firefox在事件处理上的主要差异在于事件流的支持和处理函数的添加与移除方式。理解这些差异对于编写兼容性良好的JavaScript代码至关重要。开发者需要根据目标用户群体的浏览器分布情况，适当地采用...

    两个精典的DOM查看器 IEDOM & DevToolBar

    与IE DevToolBar类似，IE DOM Inspector允许用户直观地查看网页的DOM树，并可以方便地查看和修改元素属性、样式和事件。它特别适合于分析复杂的网页布局和交互，帮助开发者快速找出潜在的问题。虽然IE DOM Inspector...

    Javascript Event事件中IE与标准DOM的比较

    JavaScript中的事件处理在不同的浏览器环境下，尤其是Internet Explorer (IE) 和遵循Document Object Model (DOM) 规范的浏览器之间存在显著差异。以下是这些差异的详细解释： 1. **事件流的区别**： - **IE冒泡型...

    IE6升级到IE9兼容性问题和操作手册

    这部分内容未给出详细信息，但可以预见，随着IE版本的提升，JavaScript的执行环境和DOM操作也会有所改变，可能涉及对旧有API的废弃和新API的支持，以及DOM事件处理的改进。 总之，从IE6升级到IE9的过程，开发者需要...

    根据DOM将html转为canvas图片格式

    DOM是HTML和XML文档的结构化表示，它将文档解析为树形结构，允许开发者通过JavaScript或其他编程语言与文档的各个元素交互。在这个场景中，DOM被用来获取HTML页面的所有内容。 2. Canvas API： HTML5引入的Canvas...

    eventsim:用于模拟 DOM 事件的微型库

    用于模拟 DOM 事件的微型库 为什么？ 我想要一个没有额外依赖项的模拟事件的库。 这使其易于在面向用户的代码中使用或作为其他库（如的依赖项使用。 该库还采用更现代的方法来尽可能使用事件构造函数来模拟事件。 ...

    ie6-ie7 dom渲染bug demo

    ie6-ie7 dom渲染bug demo

    IE DOM Inspector

    **IE DOM Inspector** 是一款专为Internet Explorer浏览器设计的调试工具，它允许开发者和网页设计师在实时环境中查看、检查和修改网页的文档对象模型（DOM）。DOM是HTML和XML文档的一种结构化表示，通过DOM，我们...

    IEWebDeveloperV2&IE DOM Inspector下载

    IE DOM Insepctor 博文链接：https://love2java.iteye.com/blog/208889

    javascript为DOM绑定事件 兼容

    为 DOM 绑定事件需要考虑浏览器的兼容性问题，我们可以使用不同的方式来绑定事件，包括直接为 Element 对象绑定事件、使用 W3C 的 addEventListener 和 IE 的 attachEvent 方法，以及自定义绑定函数等。

    ie6与ie7 8区别

    ### IE6、IE7与IE8的区别 #### 浏览器兼容性问题解析 随着Web技术的不断发展，浏览器之间的差异也日益明显。特别是在早期的浏览器版本中，如Internet Explorer（简称IE）的不同版本之间，存在着显著的差异。本文将...

    javascript转换字符串为dom对象（字符串动态创建dom）.docx

    JavaScript 转换字符串为 DOM 对象（字符串动态创建 DOM） 在 JavaScript 中，动态创建标准的 DOM 对象通常使用 `var obj = document.createElement('div');`，然后再给 `obj` 设置一些属性。但是，在实际使用过程...

    js中DOM事件绑定分析.docx

    - **this的指向**：在DOM事件中，`this`通常指向触发事件的元素，但在IE的`attachEvent`中，`this`指向`window`对象。 **最佳实践**： - 使用`addEventListener`和`removeEventListener`以保持兼容性和更好的控制。...

Magicbox
Global site tag (gtag.js) - Google Analytics