返回顶部
首页 > 资讯 > 前端开发 > node.js >javascript事件的示例分析
  • 204
分享到

javascript事件的示例分析

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

这篇文章将为大家详细讲解有关javascript事件的示例分析,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。本文实例为大家分享了js事件的传播,供大家参考,具体内容如下&

这篇文章将为大家详细讲解有关javascript事件的示例分析,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。

本文实例为大家分享了js事件的传播,供大家参考,具体内容如下

<html> 
 <head> 
  <meta charset="UTF-8"> 
  <title></title> 
  <style type="text/CSS"> 
   #box1{ 
    width: 300px; 
    height: 300px; 
    background-color: deepskyblue; 
   } 
    
   #box2{ 
    width: 200px; 
    height: 200px; 
    background-color: cadetblue; 
   } 
    
   #box3{ 
    width: 100px; 
    height: 100px; 
    background-color: chocolate; 
   } 
    
  </style> 
   
  <script type="text/javascript"> 
   
   function bind(obj , eventStr , callback){ 
     
    if(obj.addEventListener){ 
     //如果是正常浏览器 
     obj.addEventListener(eventStr , callback , false); 
    }else{ 
     //IE8 
     obj.attachEvent("on"+eventStr , function(){ 
      callback.call(obj); 
     }); 
    } 
   } 
    
   window.onload = function(){ 
     
     
     
    //分别为三个div绑定单击响应函数 
    var box1 = document.getElementById("box1"); 
    var box2 = document.getElementById("box2"); 
    var box3 = document.getElementById("box3"); 
     
    bind(box1,"click",function(){ 
     alert(1); 
    }) 
     
    bind(box2,"click",function(){ 
     alert(2); 
    }) 
     
    bind(box3,"click",function(){ 
     alert(3); 
    }) 
     
   }; 
    
    
  </script> 
 </head> 
 <body> 
   
  <div id="box1"> 
   <div id="box2"> 
    <div id="box3"></div> 
   </div> 
  </div> 
   
 </body> 
</html>

关于“javascript事件的示例分析”这篇文章就分享到这里了,希望以上内容可以对大家有一定的帮助,使各位可以学到更多知识,如果觉得文章不错,请把它分享出去让更多的人看到。

--结束END--

本文标题: javascript事件的示例分析

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

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

猜你喜欢
  • javascript事件的示例分析
    这篇文章将为大家详细讲解有关javascript事件的示例分析,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。本文实例为大家分享了js事件的传播,供大家参考,具体内容如下&...
    99+
    2024-04-02
  • JavaScript事件流的示例分析
    这篇文章主要介绍JavaScript事件流的示例分析,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!1.什么是事件流 ?在学习事件流之前我们先看看什么是事件 ?事件代表文档或浏览器窗口中某个有意义的时刻即用户与页面的交...
    99+
    2023-06-29
  • javascript滚轮事件的示例分析
    小编给大家分享一下javascript滚轮事件的示例分析,希望大家阅读完这篇文章之后都有所收获,下面让我们一起去探讨吧!具体内容如下<html>    <he...
    99+
    2024-04-02
  • Javascript事件对象的示例分析
    小编给大家分享一下Javascript事件对象的示例分析,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!如果是事件处理函数绑定的函...
    99+
    2024-04-02
  • JavaScript事件方法的示例分析
    这篇文章主要介绍了JavaScript事件方法的示例分析,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。上代码<!DOCTYPE&nbs...
    99+
    2024-04-02
  • JavaScript中DOM事件的示例分析
    这篇文章主要介绍了JavaScript中DOM事件的示例分析,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。1、事件对象【获取事件对象】什么是事件对象:是个对象,这个对象里有事...
    99+
    2023-06-29
  • javascript事件查询的示例分析
    这篇文章主要为大家展示了“javascript事件查询的示例分析”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“javascript事件查询的示例分析”这篇文章吧。click()   对...
    99+
    2023-06-03
  • JavaScript中事件机制的示例分析
    这篇文章主要介绍JavaScript中事件机制的示例分析,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!事件是将JavaScript脚本与网页联系在一起的主要方式,是JavaScrip...
    99+
    2024-04-02
  • JavaScript之事件委托的示例分析
    小编给大家分享一下JavaScript之事件委托的示例分析,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!事件委托的原理依赖于事件...
    99+
    2024-04-02
  • JavaScript中事件冒泡的示例分析
    这篇文章主要介绍JavaScript中事件冒泡的示例分析,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!什么是事件冒泡?事件冒泡刚好与事件捕获相反,当前元素---->body -...
    99+
    2024-04-02
  • JavaScript中事件捕获的示例分析
    这篇文章主要介绍JavaScript中事件捕获的示例分析,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!什么是事件捕获?当事件发生在 DOM 元素上时,该事件并不完全发生在那个元素上。...
    99+
    2024-04-02
  • JavaScript之事件循环的示例分析
    这篇文章主要介绍JavaScript之事件循环的示例分析,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!js中的事件循环因为JavaScript是单线程的,同一事件只能执行一种方法,所以会将程序中的方法加入到执行栈中按...
    99+
    2023-06-20
  • javascript事件循环event loop的示例分析
    小编给大家分享一下javascript事件循环event loop的示例分析,希望大家阅读完这篇文章之后都有所收获,下面让我们一起去探讨吧!具体如下:js是单线程的,但是event loop的出现,使得js...
    99+
    2024-04-02
  • javascript中事件监听与事件委托的示例分析
    这篇文章主要介绍了javascript中事件监听与事件委托的示例分析,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。事件监听与事件委托在js中...
    99+
    2024-04-02
  • javascript中事件执行机制的示例分析
    小编给大家分享一下javascript中事件执行机制的示例分析,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!先看一段代码各位小伙...
    99+
    2024-04-02
  • jQuery事件的示例分析
    这篇文章主要介绍了jQuery事件的示例分析,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。一.window事件<!DOCTYPE&nb...
    99+
    2024-04-02
  • Node.js事件的示例分析
    这篇文章主要为大家展示了“Node.js事件的示例分析”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“Node.js事件的示例分析”这篇文章吧。快速概览要访问此模...
    99+
    2024-04-02
  • DOM事件的示例分析
    这篇文章给大家分享的是有关DOM事件的示例分析的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。1.事件流时间流--- 描述的是从页面中接受事件的顺序。(1)事件冒泡流。事件最开始由...
    99+
    2024-04-02
  • JavaScript中事件与异常捕获的示例分析
    小编给大家分享一下JavaScript中事件与异常捕获的示例分析,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!事件处理【onCl...
    99+
    2024-04-02
  • javascript组合按键事件监听的示例分析
    这篇文章主要为大家展示了“javascript组合按键事件监听的示例分析”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“javascript组合按键事件监听的示例...
    99+
    2024-04-02
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作