javascript 事件

最新推荐文章于 2025-03-16 18:49:02 发布

qySWKqy

最新推荐文章于 2025-03-16 18:49:02 发布

阅读量186

点赞数

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/qySWKqy/article/details/80368919

本文介绍了JavaScript中常见的事件处理方式，包括直接在HTML元素上定义事件、使用DOM为元素分配事件等。探讨了不同事件的触发时机及其应用场景，例如onload、onchange及onmouseover等。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

我们可以在事件发生时执行 JavaScript，比如当用户在 HTML 元素上点击时。

如需在用户点击某个元素时执行代码，请向一个 HTML 事件属性添加 JavaScript 代码：

onclick=JavaScript

HTML 事件的例子：

在本例中，当用户在 <h1> 元素上点击时，会改变其内容：

<!DOCTYPE html>
<html>
<body>
<h1 onclick="this.innerHTML='Ooops!'">点击文本!</h1>
</body>
</html>

HTML DOM 允许您使用 JavaScript 来向 HTML 元素分配事件：

向 button 元素分配 onclick 事件：

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

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

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

onchange 事件常结合对输入字段的验证来使用。

下面是一个如何使用 onchange 的例子。当用户改变输入字段的内容时，会调用 upperCase() 函数。

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

alert() 弹出个提示框（确定）
confirm() 弹出个确认框（确定，取消）
prompt() 弹出个输入框让你输入东西

test() 方法用于检测一个字符串是否匹配某个模式.

charAt() 方法可返回指定位置的字符。

请注意，JavaScript 并没有一种有别于字符串类型的字符数据类型，所以返回的字符是长度为 1 的字符串。

push() 方法可向数组的末尾添加一个或多个元素，并返回新的长度。



$("p").mouseenter(function(){
  $("p").css("background-color","yellow");
});   当鼠标指针进入（穿过）元素时，改变元素的背景色

$("img").load(function(){
  $("div").text("Image loaded");
});  当图像加载时，改变 div 元素的文本

onload 事件会在页面或图像加载完成后立即发生