var commontop = document.getElementById("commontop");
commontop.onclick = function(ev){
   var ev = ev || window.event;
   var target = ev.target || ev.srcElement;
   if(target.className.toLowerCase() == "h5navbox"){
      if(h5navcontent.style.display==='block'){
         h5navcontent.style.display = "none";
      }else{
         h5navcontent.style.display = "block";
      }
  }
};

target.className 目标元素的className;

类似jquery中的 commontop.on("click",".h5navbox",function(){...})

原生js事件委托的更多相关文章

  1. 原生js事件委托(事件代理)方法扩展

    原生js事件委托(事件代理)方法扩展: 通过Node底层原型扩展委托方法 /** * 事件委托方法 * @param eventName {string}:事件名称,如'click' * @param ...

  2. 原生JS事件绑定方法以及jQuery绑定事件方法bind、live、on、delegate的区别

    一.原生JS事件绑定方法: 1.通过HTML属性进行事件处理函数的绑定如: <a href="#" onclick="f()"> 2.通过JavaS ...

  3. 原生js事件和jquery事件的执行顺序问题

    场景:近日,写前端页面时候,在针对输入框input操作时,用到了jquery的插件,插件中使用了jquery的focus()和blur()方法.但是同时,又需要在插件之外再针对输入框的获取焦点和失去焦 ...

  4. JS事件委托学习(转)

    JS 事件委托就是利用冒泡原理,把事件加到父级上触发,执行效果. 好处: 1.提高性能 2.新添加的元素还会有之前的事件     <</</</</li></ ...

  5. JS事件委托的原理和应用

    js事件委托也叫事件代理,实际上事件委托就是通过事件冒泡实现的,所谓的事件就是onclick,onmouseover,ondown等等,那么委托呢?委托就是指本来这个事是要你自己做的,但是你却让别人帮 ...

  6. 移动终端学习2:触屏原生js事件及重力感应

    如今智能移动设备已经渗透到人们生活的方方面面,用户数量也在不断迅速增长(市场研究机构 eMarketer 在今年初发表的趋势报告中预测,2014年至2018年,中国智能手机用户从总人口的 38.3%增 ...

  7. js事件委托 jQuery写法

    http://www.cnblogs.com/liugang-vip/p/5616484.html 不是抄的,这篇文章写的细 这是js 事件委托写法 <!DOCTYPE html> < ...

  8. js事件委托

    什么是事件委托:通俗的讲,onclick,onmouseover,onmouseout,等就是事件,委托呢,就是让别人来做,这个事件本来是加在某些元素上的,然而你却加到别人身上来做,完成这个事件. 也 ...

  9. 彻底弄懂JS事件委托的概念和作用

    一.写在前头    接到某厂电话问什么是事件代理的时候,一开始说addEventListener,然后他说直接绑定新的元素不会报dom不存在的错误吗?然后我就混乱了,我印象中这个方法是可以绑定新节点的 ...

随机推荐

  1. Eclipse快捷键 10个最有用的快捷键

    Eclipse中10个最有用的快捷键组合 一个Eclipse骨灰级开发者总结了他认为最有用但又不太为人所知的快捷键组合.通过这些组合可以更加容易的浏览源代码,使得整体的开发效率和质量得到提升. 1. ...

  2. Spring学习笔记(1)——资源加载

    <!-- 占坑,迟点补充底层原理 --> Spring支持4种资源的地址前缀 (1)从类路径中加载资源——classpath: classpath:和classpath:/是等价的,都是相 ...

  3. ios控制器生命周期详解

    #import "MyOneViewController.h" @interface MyOneViewController () @property (nonatomic, st ...

  4. android layout_weight讲解

    Layout_weight是线性布局,也就是LinearLayout里面用到的,下面通过实验来看这个Layout_weight的特性. 1.当控件的属性android:layout_width=&qu ...

  5. php大力力 [048节] php一点支付开发资料,很散

    https://beecloud.cn/activity/jsbutton/?index=4&t=1441261629019 https://beecloud.cn/download/ php ...

  6. 电量/信号的显示 imageLevel

    通过imageLevel可以对1个imageView在不同的level值显示不同的图片,通常用于显示电量,wifi信号,蓝牙信号等信息: 1.编写xml ,在drawable目录 <level- ...

  7. C#知识体系(二)用案例来理解委托与事件

    上一篇博客讲到了LinQ和lambda的常用方法 还有很多我们未知但c#设计团队已经为我们封装好的类和方法.随着我们不断的熟悉C#语言,渐渐的就会接触到其他的知识点,委托.事件.反射.线程.同步,异步 ...

  8. [转]IoC模式

    IoC模式 1.依赖 依赖就是有联系,有地方使用到它就是有依赖它,一个系统不可能完全避免依赖.如果你的一个类或者模块在项目中没有用到它,恭喜你,可以从项目中剔除它或者排除它了,因为没有一个地方会依赖它 ...

  9. Python 基礎 - 文件操作_v2

    嗯,那如何要把游標的位置給打印來? #!/usr/bin/env python3 # -*- coding:utf-8 -*- f = open('test', 'r') print(f.tell() ...

  10. CSS外边距margin上下元素重叠

    CSS外边距margin上下元素重叠 转载:http://www.gaoyouyou.com/view/77.htm 两个或多个块级盒子的垂直相邻边界会重合.结果的边界宽度是相邻边界宽度中最大的值.如 ...