JavaScript HTML DOM中如何 对HTML事件做出反应(DOM,html,javascript,开发技术)

时间:2024-05-06 01:35:54 作者 : 石家庄SEO 分类 : 开发技术
  • TAG :

    JavaScript+HTML+DOM%E4%B8%AD%E5%A6%82%E4%BD%95+%E5%AF%B9HTML%E4%BA%8B%E4%BB%B6%E5%81%9A%E5%87%BA%E5%8F%8D%E5%BA%94

JavaScript HTML DOM 事件
HTML DOM 使 JavaScript 有能力对 HTML 事件做出反应。
我们可以在事件发生时执行 JavaScript,比如当用户在 HTML 元素上点击时。
HTML 事件的例子:
当用户点击鼠标时
当网页已加载时
当图像已加载时
当鼠标移动到元素上时
当输入字段被改变时
当提交 HTML 表单时
当用户触发按键时
下面的实例中,当用户在 <h2> 元素上点击时,会改变其内容:

下面的实例从事件处理器调用一个函数:


HTML 事件属性
如需向 HTML 元素分配事件,您可以使用事件属性。
例如,你可以向 button 元素分配 onclick 事件:

注释:在上面的例子中,名为 displayDate 的函数将在按钮被点击时执行。

使用 HTML DOM 来分配事件
HTML DOM 允许您通过使用 JavaScript 来向 HTML 元素分配事件。
例如,可以向 button 元素分配 onclick 事件:

注释:在上面的例子中,名为 displayDate 的函数被分配给 id=myButn" 的 HTML 元素。

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

onload 事件可用于检测浏览器类型和浏览器版本,并基于这些信息来加载网页的正确版本。
如,onload 和 onunload 事件可用于处理 cookie:


onchange 事件
onchange 事件常结合对输入字段的验证来使用。
例如,当用户改变输入字段的内容时,会调用 upperCase() 函数:


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

下面是一个简单的 onmouseover-onmouseout 实例:


onmousedown、onmouseup 以及 onclick 事件
onmousedown, onmouseup 以及 onclick 构成了鼠标点击事件的所有部分:
当点击鼠标按钮时,会触发 onmousedown 事件,
当释放鼠标按钮时,会触发 onmouseup 事件
当完成鼠标点击时,会触发 onclick 事件
下面是一个简单的 onmousedown-onmouseup 实例:

下面的实例中,当用户按下鼠标按钮时,更换一幅图像。


onfocus 事件

本文:JavaScript HTML DOM中如何 对HTML事件做出反应的详细内容,希望对您有所帮助,信息来源于网络。
上一篇:CSS如何设置列表项的样式下一篇:

14 人围观 / 0 条评论 ↓快速评论↓

(必须)

(必须,保密)

阿狸1 阿狸2 阿狸3 阿狸4 阿狸5 阿狸6 阿狸7 阿狸8 阿狸9 阿狸10 阿狸11 阿狸12 阿狸13 阿狸14 阿狸15 阿狸16 阿狸17 阿狸18