对于给同一个元素添加两个点击事件时，其中一个是通过js获取元素添加点击事件另一个是通过内联的方法为元素添加事件。

执行之后只会执行通过元素获取的点击事件。而内联式的添加点击事件是不会执行的

还有一个就是 a链接跳转不会影响内联式的点击事件执行

<body>

    <div class="container" onclick="abc()">

        <span>这是1</span>

    <a href="http://www.baidu.com" onclick="abc()">跳转百度</a>

    </div>

    <script type="text/javascript">

        var dom = document.querySelector('.container');

        dom.onclick = function(){

            console.log("直接调用点击事件");

        }

        function abc(){

            console.log("通过内联事件添加点击事件");

        }

    </script>

</body>

JavaScript之onclick事件的更多相关文章

  1. javascript中onclick事件能调用多个方法吗

    Q: javascript中onclick事件能调用多个方法吗? A: 可以的,方法如下onclick="aa();bb();cc();"每个方法用“;”分号隔开就行了

  2. JavaScript的 onclick 事件是如何调用jquery 方法的

    看见个不错的问答,关于JavaScript的 onclick 事件是如何调用jquery 方法的,特此标注,链接如下:http://segmentfault.com/q/101000000033350 ...

  3. JavaScript给onclick事件赋值，动态传参数实例辩错

    错误的例子: <body> <input id="certid" type="text" value="123456" & ...

  4. 【Javascript】IE8兼容 背景图片与a标签的onclick事件

    先说几句牢骚话. 虽然IE8比之IE6.7有很大的进步,但是在执行效率.兼容性上仍然有很多问题.被广大开发者喜爱的平台才是好平台. 可惜多亏当年盗版XP打开中国的计算机市场,IE作为一款捆绑软件仍然在 ...

  5. 【转】onclick事件与href='javascript:function()'的区别

    href='javascript:function()'和onclick能起到同样的效果,一般来说,如果要调用脚本还是在onclick事件里面写代码,而不推荐在href='javascript:fun ...

  6. 使用JavaScript动态的绑定、解绑 a 标签的onclick事件，防止重复点击

    页面上的 a 标签如下: <a class="more" style="cursor: pointer;" id="commentMore&qu ...

  7. javascript onclick事件可以调用两个方法吗？

    答案是:可以的,onclick事件可以调用多个方法,每个方法之间用分号(:)隔开即可. onclick后面其实是可以写任何代码的,但是一般不建议这么写!! 例:onclick="fun1() ...

  8. ArcGIS JavaScript API异常之onExtentChange事件覆盖onClick事件

    利用Esri官方提供的聚合类进行聚合,由于数据较多,为了加快速度,在聚合之前对当期范围进行判断,如果不在当前视图范围的,就不聚合了. 所以,由于Esri官方的类是监听了zoomEnd事件,如下代码 t ...

  9. javascript 的button onclick事件不起作用的解决方法

    在项目中遇到个问题:servlet向前端返回如下按钮,当course_ID为数字是onclick事件正常,但当course_ID含有字母时onclick事件就不起作用.网上找了很多方法都不管用,最后自 ...

随机推荐

  1. 8——PHP循环结构&&条件结构

    */ * Copyright (c) 2016,烟台大学计算机与控制工程学院 * All rights reserved. * 文件名:text.cpp * 作者:常轩 * 微信公众号:Worldhe ...

  2. GitLab-CI部署及踩坑总结

    转载请注明出处:https://www.cnblogs.com/shining5/p/8863063.html 部署GitLab-CI 简介 GitLab_CI(gitlab continuous i ...

  3. 一块小饼干(Cookie)的故事-下篇

    上篇介绍了注册的基本流程,下篇简单的讲讲登录的流程以及Cookie的出现 实现登录的小功能 当你在浏览器的输入框里输入localhost:8080/sign_in的时候,会发起GET请求,去访问sig ...

  4. 零基础JavaScript编码（一）

    任务目的 JavaScript初体验 初步明白JavaScript的简单基本语法,如变量.函数 初步了解JavaScript的事件是什么 初步了解JavaScript中的DOM是什么 任务描述 参考以 ...

  5. nginx前端服务部署

    一.登录服务器 登录跳板机 执行list,列出所有机器 执行dssh 机器序号,如dssh 1,选择机器 二. 创建nginx配置文件 进入nginx配置目录:cd usr/local/nginx/c ...

  6. 使用selenium模拟登陆淘宝、新浪和知乎

    如果直接使用selenium访问淘宝.新浪和知乎这些网址.一般会识别出这是自动化测试工具,会有反制措施.当开启开发者模式后,就可以绕过他们的检测啦.(不行的,哭笑) 如果网站只是对windows.na ...

  7. AspNetCore3.1_Middleware源码解析_3_HttpsRedirection

    概述 上文提到3.1版本默认没有使用Hsts,但是使用了这个中间件.看名字就很好理解,https跳转,顾名思义,就是跳转到 https地址. 使用场景,当用户使用http访问网站时,自动跳转到http ...

  8. 如何在国内离线安装Chrome扩展并科学查资料

    国内离线安装Chrome扩展 这些链接是从知乎国内离线安装 Chrome 扩展程序的方法总结 - 知乎看到的, 怕这个链接失效, 在这里自己备一份: Crx4Chrome - Download CRX ...

  9. 03 Uipath调用VBA脚本，处理excel文档格式

    前言: 在平时我们的工作中,经常需要使用Uipath自动的导入大量数据到Excel表格中,但是却发现,数据导入到Excel之后,格式却是很乱,基本不能看,就像下图: ​ 而Uipath对Excel的操 ...

  10. ES6整体内容

    ES6内容: 附网站链接:http://www.jscwwd.com/article/5e6488e849a13d1a89caf574