zoukankan      html  css  js  c++  java
  • Javascrpt 速成篇】 三:js事件处理

    ie和chrome,firefox的事件处理,除了函数名字不同,基本大同小异。这样就已chrome为主了,对ie有兴趣的自己去百度。jquery已经处理不同浏览器兼容性问题,推荐使用。

    事件处理有两种常用方法,一种通过标签的onXXX属性,第二种是给标签(元素)添加事件监听器,下面已给出实例:

    <!DOCTYPE html>
    <html>
    
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <title>js event</title>
    </head>
    
    <body>
    
    
        <button onclick="clickMe()">Click Me</button>
        <button id="getTimeBtn">Get Time</button>
    
        <script>
            //处理clickMe
            function clickMe() {
                alert('you clicked me !');
            }
        </script>
    
        <script>
            //获取btnEle元素
            var btnEle = document.getElementById('getTimeBtn');
            //为点击事件添加监听器
            btnEle.addEventListener('click', function () {
    
                alert(new Date());
    
            });
            /*  
              注意,这段代码必须放在getTimeBtn下面,否则将出错,因为如果放在getTimeBtn上面,
              程序从上向下执行,document.getElementById('getTimeBtn')返回的将是
              undefined,这是初学者常见的错误。此外,还有一种方法,就是当文档加载完了,
              去添加事件监听器,这个事件叫onload, 这里作为作业了。
              */
        </script>
    </body>
    
    </html>
  • 相关阅读:
    iframe的使用小贴士
    jquery M97-datepicker日历控件
    CSS z-index 属性的使用方法和层级树的概念
    常用的js代码
    图片水平垂直居中
    server端和前端的区别
    nodejs模块化标准
    nodejs介绍
    小程序缓存Storage的基本用法
    小程序数据绑定的拓展用法
  • 原文地址:https://www.cnblogs.com/fzqm/p/4725537.html
Copyright © 2011-2022 走看看