onkeypress 事件可以在 JavaScript 中使用以下两种方式触发:
window.onkeypress
window.document.body.onkeypress
要了解两者之间的区别,我们需要看一下HTML DOM(文档对象模型):
- DOM 是一个将 HTML 文档表示为树结构的模型。
- 树结构将根节点作为文档对象。
- 其他节点(如 HTML、HEAD 和 BODY)彼此之间具有父/子关系。
window.onkeypress:当在窗口对象上按下某个键时,将触发 window.onkeypress
事件。
语法:
window.onkeypress = function(){myScript};
方法:
- 使用可用的窗口对象调用 window.onkeypress 来执行函数。
- 定义需要执行的函数(在例子中为 myScript())。
注意:这里选择的对象是窗口对象,即DOM的根节点。
例:
<!DOCTYPE html>
<html>
<body>
<script>
window.onkeypress = function() {myFunction()};
function myFunction() {
alert("Hi,vsdiffer.com");
}
</script>
</body>
</html>
window.document.body.onkeypress:当在正文对象上按下某个键时,将触发 window.document.body.onkeypress
事件。
语法:
window.document.body.onkeypress = function(){myScript};
方法:
- 使用可用的窗口对象调用 window.onkeypress 来执行函数。
- 定义需要执行的函数(在例子中为 myScript())。
注意:这里选择的对象是 body 对象,它是 HTML 节点的子节点,它又是窗口对象的子节点,即 DOM 的根节点。
例:
<!DOCTYPE html>
<html>
<body>
<script>
window.document.body.onkeypress = function() {myFunction()};
function myFunction() {
alert("Hi,yiibai.com");
}
</script>
</body>
</html>
window.onkeypress
和 window.document.body.onkeypress
之间的区别:
编号 | window.onkeypress |
window.document.body.onkeypress |
---|---|---|
1 | 选定的对象是窗口对象,即DOM的根节点。 | 选定的对象是 body 对象,它是 HTML 节点的子节点,而 HTML 节点又是窗口对象的子对象,即 DOM 的根节点。 |
2 | window 是所有文件 |
window.document.body 引用 body 标记 |
3 | window 支持 IE4 及更高版本 |
document.body 支持 IE6 及更高版本 |
4 | 当用户按键盘上的键时,将发生 windows.onkeypress 事件。 |
当用户按 body 对象上的键时,将发生 window.document.body.onkeypress 事件。 |
5 | 它支持的浏览器是 :Chrome , Microsoft Edge, Safari, Opera Mini, Firefox。 | 它支持的浏览器是 :Chrome, Microsoft Edge, Safari, Opera Mini, Firefox |
结论:尽管它们产生相似的输出,但它们在选择对象方面的功能是不同的。
window.onkeypress和window.document.body.onkeypress的区别
欢迎任何形式的转载,但请务必注明出处,尊重他人劳动成果。
转载请注明:文章转载自 有区别网 [http://www.vsdiffer.com]
本文标题:window.onkeypress和window.document.body.onkeypress的区别
本文链接:https://www.vsdiffer.com/vs/difference-between-window-onkeypress-and-window-document-body-onkeypress.html
免责声明:以上内容仅代表 个人看法、理解、学习笔记、总结和研究收藏。不保证其正确性,因使用而带来的风险与本站无关!如本网站内容冒犯了您的权益,请联系站长,邮箱:,我们核实并会尽快处理。