广告
返回顶部
首页 > 资讯 > 前端开发 > html >js中DOM2兼容处理this的示例分析
  • 571
分享到

js中DOM2兼容处理this的示例分析

2024-04-02 19:04:59 571人浏览 独家记忆
摘要

这篇文章主要介绍js中DOM2兼容处理this的示例分析,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!DOM2级存在的兼容问题,这里先说一下this的问题。 function&nbs

这篇文章主要介绍js中DOM2兼容处理this的示例分析,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!

DOM2级存在的兼容问题,这里先说一下this的问题。


function bind(curEle,evenType,evenFn){
 if('addEventListener' in document){
  curEle.addEventListener(evenType,evenFn,false);
  return;
 }
 //给evenFn化妆 并且把化妆前的照片贴在自己对应的脑门上
 var tempFn = function(){
  evenFn.call(curEle)
 }
 tempFn.photo = evenFn;
 //首先判断自定义属性之前是否存在,不存在的话创建一个,由于要存储多个化妆后的结果,所以我们让其值是一个数组
 if(!curEle["mybind"+evenType]){//根据不同的事件类型是不同的数组
  curEle["mybind"+evenType] = [];
 }
 curEle["mybind"+evenType].push(tempFn);
 curEle.attachEvent("on"+evenType,tempFn);
 //这里的开始想法是改变this的指向,把this不指向window
 
}

function unbind(curEle,evenType,evenFn){
 if('removeEventListener' in document){
  curEle.removeEventListener(evenType,evenFn,false);
  return;
 }
 //拿evenFn到curEle["myBind"]这里找化妆后的结果,找到之后再事件池中把化妆后的结果移除事件池
 var ary = curEle['myBind'+evenType];
 for(var i = 0;i<ary.length;i++){
  if(ary[i].photo===evenFn){
   curEle.detachEvent("on"+evenType,ary[i]);
   break;
  }
 }
 
}

以上是“js中DOM2兼容处理this的示例分析”这篇文章的所有内容,感谢各位的阅读!希望分享的内容对大家有帮助,更多相关知识,欢迎关注编程网html频道!

--结束END--

本文标题: js中DOM2兼容处理this的示例分析

本文链接: https://www.lsjlt.com/news/75443.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
  • js中DOM2兼容处理this的示例分析
    这篇文章主要介绍js中DOM2兼容处理this的示例分析,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!DOM2级存在的兼容问题,这里先说一下this的问题。 function&nbs...
    99+
    2022-10-19
  • js之dom2级事件的示例分析
    这篇文章主要介绍js之dom2级事件的示例分析,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!我们使用的DOM2事件绑定,其实是让box通过原型链一直找到EventTarget这个内置...
    99+
    2022-10-19
  • js中this原理的示例分析
    这篇文章主要介绍了js中this原理的示例分析,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。首先我们来概括下this.this是一个对象,一...
    99+
    2022-10-19
  • js中如何解决DOM2兼容处理重复的问题
    这篇文章主要介绍了js中如何解决DOM2兼容处理重复的问题,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。具体如下在解决this问题之后,只需...
    99+
    2022-10-19
  • border-radius IE8兼容处理的示例分析
    这篇文章将为大家详细讲解有关border-radius IE8兼容处理的示例分析,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。根据canisue(http://caniu...
    99+
    2022-10-19
  • bootstrap和IE8兼容性处理的示例分析
    这篇文章主要介绍了bootstrap和IE8兼容性处理的示例分析,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。bootstrap IE8 兼...
    99+
    2022-10-19
  • javascript兼容性的示例分析
    这篇文章主要为大家展示了“javascript兼容性的示例分析”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“javascript兼容性的示例分析”这篇文章吧。1...
    99+
    2022-10-19
  • Vue+iview+webpack中ie浏览器兼容处理的示例分析
    这篇文章主要介绍Vue+iview+webpack中ie浏览器兼容处理的示例分析,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!环境介绍:vue: ^2.5.2iview: ^3.1....
    99+
    2022-10-19
  • flex和position兼容的示例分析
    这篇文章将为大家详细讲解有关flex和position兼容的示例分析,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。示例如下<!DOCTYPE html&g...
    99+
    2022-10-19
  • 浏览器中兼容性的示例分析
    小编给大家分享一下浏览器中兼容性的示例分析,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!浏览器就是2大派系,一个是其他浏览器,一...
    99+
    2022-10-19
  • HTML5中进度条progress元素及兼容性处理的示例分析
    HTML5中进度条progress元素及兼容性处理的示例分析,相信很多没有经验的人对此束手无策,为此本文总结了问题出现的原因和解决方法,通过这篇文章希望你能解决这个问题。一、progress元素基本了解1....
    99+
    2022-10-19
  • HTML5新标签兼容的示例分析
    这篇文章主要介绍HTML5新标签兼容的示例分析,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!第一种方法:(使用html5shiv)<!--[if lt IE...
    99+
    2022-10-19
  • CSS3浏览器兼容的示例分析
    这篇文章给大家分享的是有关CSS3浏览器兼容的示例分析的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。一、浏览器兼容1.1、概要世界上没有任何一个浏览器是一样的,同样的代码在不一样...
    99+
    2022-10-19
  • CSS Hack兼容代码的示例分析
    小编给大家分享一下CSS Hack兼容代码的示例分析,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧! 经常使用CSS HACK标...
    99+
    2022-10-19
  • Webpack4+Babel7+ES6兼容IE8的示例分析
    这篇文章主要介绍Webpack4+Babel7+ES6兼容IE8的示例分析,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!ES6兼容IE8需要解决四个问题语法支持IE浏览器不支持ES6...
    99+
    2022-10-19
  • javascript中 “this”的示例分析
    小编给大家分享一下javascript中 “this”的示例分析,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!一、前言:我们知道...
    99+
    2022-10-19
  • js中this的指向问题归纳的示例分析
    这篇文章给大家分享的是有关js中this的指向问题归纳的示例分析的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。thisthis:上下文,会根据执行环境变化而发生指向的改变.1.单...
    99+
    2022-10-19
  • vue中引入mousewheel事件及兼容性处理方式的示例分析
    小编给大家分享一下vue中引入mousewheel事件及兼容性处理方式的示例分析,希望大家阅读完这篇文章之后都有所收获,下面让我们一起去探讨吧!引入mousewheel事件及兼容性处理项目实现过程中需要对一个已经有纵向滚动条的table表格...
    99+
    2023-06-29
  • 兼容性CSS HACK代码的示例分析
    这篇文章主要介绍兼容性CSS HACK代码的示例分析,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完! 1.区别IE与非IE涉猎器CSS HACK代码  #CSS5{...
    99+
    2022-10-19
  • CSS多浏览器兼容的示例分析
    本篇文章给大家分享的是有关CSS多浏览器兼容的示例分析,小编觉得挺实用的,因此分享给大家学习,希望大家阅读完这篇文章后可以有所收获,话不多说,跟着小编一起来看看吧。 1、DOC...
    99+
    2022-10-19
软考高级职称资格查询
推荐阅读
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作