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. QM UML状态机建模实例之Blinky for cortex-m0

    简介:QP由Quantum Leaps公司开发异于传统顺序式系统(前后台架构即main+ISR)和传统多任务系统(操作系统)的事件驱动型状态机框架,实现了在C语言下的面向对象编程,该框架支持有限状态机 ...

  2. C#打印条码与ZPL

    ZPL(Zebra Programming Language) 是斑马公司(做条码打印机的公司)自己设计的语言, 由于斑马打印机是如此普遍, 以至于据我所见所知, 条码打印机全部都是斑马的, 所以控制 ...

  3. Java并发编程学习笔记(一)——线程安全性

    主要概念:线程安全性.原子性.原子变量.原子操作.竟态条件.复合操作.加锁机制.重入.活跃性与性能. 1.当多个线程访问某个状态变量并且其中有一个线程执行写入操作时,必须采用同步机制来协同这些线程对变 ...

  4. ASP.NET MVC3的学习

    ASP.NET MVC第一次课(2013-12-25晚学完)     1.ASP.NET MVC 的特点       分离任务          可扩展        强大的URL重写(路由)机制   ...

  5. [转]Scrapy入门教程

    关键字:scrapy 入门教程 爬虫 Spider 作者:http://www.cnblogs.com/txw1958/ 出处:http://www.cnblogs.com/txw1958/archi ...

  6. HTTP请求方法

    HTTP请求方法 根据HTTP标准,HTTP请求可以使用多种请求方法. HTTP1.0定义了三种请求方法: GET, POST 和 HEAD方法. HTTP1.1新增了五种请求方法:OPTIONS, ...

  7. Qt图形视图框架公开课资料

    接受CSDN学院的邀请,讲一次公开课,主题是Qt图形视图框架,报名链接在这里:http://edu.csdn.net/huiyiCourse/detail/228. 内容有两部分:自定义Item和拖放 ...

  8. caffe 基本知识简介

    很多不错的网页: 1.http://alanse7en.github.io/caffedai-ma-jie-xi-1/ 主要介绍基本caffe知识 interace 接口 API中的‘I’ Caffe ...

  9. web api 初体验之 GET和POST传参

    上一篇我们讲到了web api跨域的问题 它几乎是每一个用web api的人都需要去解决的问题,不然都没法测试.接下来会遇到的问题就是传参了.还是用js前台调用服务的方式. GET 方式 get方式传 ...

  10. 第五章 搭建 S3C6.410 开发板的 测试环境

    一.简介: 对于嵌入式驱动开发者来说,你必须要了解什么是开发板:它与我们经常用的手机类似, 包含了显示屏. 键盘. Wi-Fi. 蓝牙等模块等,是开发者必备的硬件设备.但与手机不同的是:在开发板上安装 ...