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. 3.flask核心与源码剖析

    1.session session存储了特定用户会话所需的属性及配置信息,这样,当用户在应用程序的 Web 页之间跳转时,存储在 session 对象中的变量将不会丢失,而是在整个用户会话中一直存在下 ...

  2. Linux下putenv()函数导致composer更新失败

    bug复现: 原因: putenv() 函数设置特定的环境变量有可能是一个潜在的安全漏洞,所以这个函数在php配置文件中是默认禁止的,在 php.ini 中查找此函数,然后将此函数删除掉,重载配置即可 ...

  3. Python代码风格的良好养成

    Python 的代码风格由 PEP 8 描述.这个文档描述了 Python 编程风格的方方面面.在遵守这个文档的条件下,不同程序员编写的 Python 代码可以保持最大程度的相似风格.这样就易于阅读, ...

  4. Mongodb的锁 原子性 隔离性 一致性

    读写锁 Mongodb使用读写锁来来控制并发操作: 当进行读操作的时候会加读锁,这个时候其他读操作可以也获得读锁.但是不能或者写锁. 当进行写操作的时候会加写锁,这个时候不能进行其他的读操作和写操作. ...

  5. iptables内网访问外网 ε=ε=ε=(~ ̄▽ ̄)~

    介绍 iptables概述: netfilter/iptables : IP信息包过滤系统,它实际上由两个组件netfilter 和 iptables 组成. netfilter/iptables 关 ...

  6. 自我介绍 & 友链

    "Never say never until the very end." --Flere825 想了想其实没什么可介绍的--毕竟我这么菜也没多少人认识我qwq还是写一点吧. 某弱 ...

  7. django 路由层(反向解析)03

    目录 ORM表关系建立 Django请求生命周期流程图 urls.py 路由层 无名分组 有名分组 反向解析 无名分组的反向解析 有名分组的反向解析 以编辑功能为例 路由分发 名称空间 伪静态 虚拟环 ...

  8. 前端之HTML初识

    目录 手写服务端,启用浏览器(客户端连接服务端) Web服务的本质: HTTP协议(HyperText Transfer Protocol) HMTL(HyperText Mark Language) ...

  9. 写在centos7 最小化安装之后

    1.最小化安装之后首先解决联网问题(https://lintut.com/how-to-setup-network-after-rhelcentos-7-minimal-installation/) ...

  10. [Python之路] HTTP协议复习笔记

    一.HTTP请求的直观了解 我们使用网络调试助手来模拟一个TCP Server,然后使用浏览器来访问对应的IP:Port. 启动后,我们使用谷歌浏览器来访问192.168.1.8:8080: 我们可以 ...