首页 > 编程语言 >JavaScript HTML DOM 事件

JavaScript HTML DOM 事件

时间:2022-09-23 12:45:54浏览次数:60  
标签:onload onunload 鼠标 DOM JavaScript 点击 HTML 事件

对事件做出反应:

  • 当用户点击鼠标时
  • 当网页已加载时
  • 当图像已加载时
  • 当鼠标移动到元素上时
  • 当输入字段被改变时
  • 当提交 HTML 表单时
  • 当用户触发按键时

用户点击改变内容:

 

 事件处理器调用一个函数:

 

HTML事件属性:

如果需要向HTML元素分配事件,可以使用事件属性:

<button onclick="displayDate()">点这里</button>

名为 displayDate 的函数将在按钮被点击时执行

onload 和 onunload 事件:

onload 和 onunload 事件会在用户进入或离开页面时被触发

onload 事件可用于检测访问者的浏览器类型和浏览器版本,并基于这些信息来加载网页的正确版本。

onload 和 onunload 事件可用于处理 cookie。

 

onchange事件:

此事件是对输入字段的验证来使用

onmouseover 和 onm ouseout 事件:

onmouseover 和 onm ouseout 事件可用于在用户的鼠标移至 HTML 元素上方或移出元素时触发函数。

onmousedown、onmouseup 以及 onclick 事件:

onmousedown:点击鼠标按钮

onmouseup:释放鼠标按钮

onclick:完成鼠标点击时

 

标签:onload,onunload,鼠标,DOM,JavaScript,点击,HTML,事件
From: https://www.cnblogs.com/MDRY/p/16722213.html

相关文章

  • 我的第一个HTML网页
    大概的了解了HTML、CSS、JS是什么,有什么用。第一节课主要学习HTML的一些基础和入门,后面阶段在慢慢嵌入CSS的学习VSCodeVSCode,功能强大的编辑器 通过学习了解......
  • HTML实体
    HTML实体实体字符:HTMLEntity实体字符通常用于在页面中显示一些特殊符号&单词;&#数字;小于符号<大于符号>空格符号 版权符号@copy;&符号&......
  • JavaScript HTML DOM - 改变CSS
    改变HTML样式:语法:document.getElementById(id).style.property=新样式 使用事件:HTMLDOM允许通过触发事件来执行代码:比如:元素被点击。页面加载完成。输入框被修......
  • JavaScript HTML DOM
    DOM(文档对象模型)      文档        -文档表示的就是整个的html网页文档      对象        -对象表示将......
  • DOM第4章tab切换和自定义属性节点操作
    tab切换和自定义属性京东tab栏切换<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><metahttp-equiv="X-UA-Compatible"content="IE=edge">......
  • HTML
    1HTMl简介HTML是一个网页的主体部分,也是一个网页的基础。因为一个网页可以没有样式,可以没有交互,但是必须要有网页需要呈现的内容。所以HTML部分是整个前端的基础。HTML,......
  • HTML & CSS 设计原则
    设计原则DesignPrinciple响应式设计Responsive响应式设计的意思是网页能够根据其显示在的屏幕的大小自动伸缩。响应式设计使得对笔记本和手机用户更加友好。分辨率......
  • html标签
    html整体结构<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><title>标题</title></head><body>这是一个html页面!</body></html>纯粹展......
  • javascript: 复制对象时的深拷贝及浅拷贝(chrome 105.0.5195.125)
    一,js代码<html><head><metacharset="utf-8"/><title>测试</title></head><body><buttononclick="assign()">无效:变量直接赋值</button><br/><br/><br......
  • JSON和JavaScript自定义对象
    JavaScript自定义对象:var对象名称={属性名称1:属性值1,属性名称2:属性值2,...,函数名称:function(形参列表){},...}; 访问对象:对象名称.属性名称......