JavaScript事件

1、<button id="btn1" onclick="document.getElementById("btn1").innerText=Date();">现在的时间是?</button>

2、<button onclick="this.innerHTML=Date()">现在的时间是?</button>

3、<button id="btn1" onclick="display_type()">现在的时间是?</button>

<script>

function display_type(){

document.getElementById("btn1").innerText=Date();

}

</script>

JavaScript常见的HTML事件

下面是一些常见的HTML事件的列表:

事件 描述
onchange HTML 元素改变
onclick 用户点击 HTML 元素
onmouseover 用户在一个HTML元素上移动鼠标
onmouseout 用户从一个HTML元素上移开鼠标
onkeydown 用户按下键盘按键
onload 浏览器已完成页面的加载

JavaScript作用域

事件可以用于处理表单验证,用户输入,用户行为及浏览器动作:

  • 页面加载时触发事件
  • 页面关闭时触发事件
  • 用户点击按钮执行动作
  • 验证用户输入内容的合法性
  • 等等 ...

可以使用多种方法来执行 JavaScript 事件代码:

  • HTML 事件属性可以直接执行 JavaScript 代码
  • HTML 事件属性可以调用 JavaScript 函数
  • 你可以为 HTML 元素指定自己的事件处理程序
  • 你可以阻止事件的发生。
  • 等等 ...

JavaScript日常学习4的更多相关文章

  1. JavaScript日常学习2

    JavaScript 数据类型    字符串(String).数字(Number).布尔(Boolean).数组(Array).对象(Object).空(Null).未定义(Undefined). e ...

  2. JavaScript日常学习3

    JavaScript函数  函数就是包裹在花括号中的代码块,前面使用了关键词 function: function functionname()     {执行代码} function myFunct ...

  3. JavaScript日常学习1

    您会经常看到 document.getElementById("id"). 这个方法是 HTML DOM 中定义的. DOM (Document Object Model)(文档对 ...

  4. JavaScript日常学习6

    JavaScript的运算符.比较符.条件语句.循环语句.跳出循环(break.continue).标签 JavaScript的运算符.比较符.条件语句.循环语句.跳出循环(break.continu ...

  5. JavaScript日常学习5

    JavaScript字符串属性和方法 eg :var txt = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";      var sln = txt.length; ...

  6. 大量Javascript/JQuery学习教程电子书合集

    [推荐分享]大量Javascript/JQuery学习教程电子书合集,送给有需要的人   不收藏是你的错^_^. 经证实,均可免费下载. 资源名称 资源大小   15天学会jQuery(完整版).pd ...

  7. [推荐分享]大量Javascript/JQuery学习教程电子书合集,送给有需要的人

    不收藏是你的错^_^. 经证实,均可免费下载. 资源名称 资源大小   15天学会jQuery(完整版).pdf 274.79 KB   21天学通JavaScript(第2版)-顾宁燕扫描版.pdf ...

  8. 正则表达式(javascript)学习总结

    正则表达式在jquery.linux等随处可见,已经无孔不入.因此有必要对这个工具认真的学习一番.本着认真.严谨的态度,这次总结我花了近一个月的时间.但本文无任何创新之处,属一般性学习总结. 一.思考 ...

  9. JavaScript 基础学习1-day14

    JavaScript 基础学习1 知识预览JavaScript概述二 JavaScript的基础三 JavaScript的对象BOM对象DOM对象实例练习js扩展 JavaScript概述 JavaS ...

随机推荐

  1. Markdown,让你的代码高亮起来

    当你的审美提高或者习惯了Linux下的黑色代码高亮,已经不满足与博客园原有的代码高亮,那么这篇博客就是你的选择. 代码块高亮 代码块Highlight /* 使用了Monokai Sublime的黑色 ...

  2. VMware的linux虚拟机配置ip后无法ping通宿主机

    VMware的linux虚拟机配置ip(使用eth0)后无法ping通宿主机,同样宿主机无法ping通linux虚拟机. 可能原因:linux虚拟机使用的网卡,与本机使用的网卡不同,配置成与本机一致的 ...

  3. ubuntu16.04安装cuDNN

    cudnn的安装非常简单 (1)下载安装文件 按需求下载cudnn的安装文件:https://developer.nvidia.com/rdp/cudnn-archive Tar File的下载如下图 ...

  4. windows下前端开发环境配置

    nvm安装 多媒体布局 前端自动化构建工具,gulp nvm管理node的版本,npm是node的包管理工具 下载nvm安装包 https://github.com/coreybutler/nvm-w ...

  5. C# MVC的默认页

    MVC的默认页,其实是默认路由设置启动哪一个Controller的哪一个Action,在根目录的Global.asax.cs里面设置.是MVC项目里面的路由.將下面的controller和action ...

  6. head first 设计模式笔记1-策略模式:模拟鸭子

    1.第一个设计原则:找出应用中可能需要变化之处,把它们独立出来,不要和那些不需要变化的代码混在一起.该原则几乎是所有设计模式背后的精神所在. 这个原则的另一种思考方式:把会变化的部分取出并封装起来,以 ...

  7. ORACLE/SQL用函数进行每年,每月,每周,每日的数据汇总

    15/03/21  用函数进行每年,每月,每周,每日的数据汇总 假设一个销售明细表 sale_detail 含有 国家(country),销售时间(sale_time),销售额(sale_money) ...

  8. Pod初始化容器之Init Container

    Init 容器的介绍 Pod能够具有多个容器,应用运行在容器里面,但是它也可能有一个或多个先于应用容器启动的 Init容器Init 容器与普通的容器非常像,除了如下两点:  c Init 容器总是运行 ...

  9. AcWing:105. 七夕祭(前缀和 + 中位数 + 分治 + 贪心)

    七夕节因牛郎织女的传说而被扣上了「情人节」的帽子. 于是TYVJ今年举办了一次线下七夕祭. Vani同学今年成功邀请到了cl同学陪他来共度七夕,于是他们决定去TYVJ七夕祭游玩. TYVJ七夕祭和11 ...

  10. B. Chocolates

    B. Chocolates time limit per test 2 seconds memory limit per test 256 megabytes input standard input ...