js-事件
什么是事件?
浏览器和用户之间的交互行为
注册事件处理程序
通过 dom 元素的属性注册事件
???<button type="button" id="btn">点我</button> ???<script> ???????// 获取 dom 元素 ???????var btn = document.getElementById(‘btn‘); ???????// 通过 dom 元素的属性注册事件 ???????btn.onclick = function(event){ ???????????// 事件对象中包含了事件的详细信息 ???????????console.log(event) ???????????????????????console.log(‘Hello Vuejs!‘) ???????}; ???</script>通过标签的属性注册事件
<button type="button" id="btn" onclick="greeting();">点我</button>
<script>
function greeting(){
console.log(‘Hello‘);
console.log(‘World‘);
}
</script>
通过标签的属性注册事件
???<button type="button" id="btn">点我</button> ???<script> ???????// 获取dom元素 ???????var btn = document.getElementById(‘btn‘); ???????btn.addEventListener(‘click‘, function(){ ???????????console.log(‘使用addEventListener()方法注册事件‘); ???????}); ??????????</script>事件的分类
鼠标事件
onclick 点击鼠标
ondblclick 双击鼠标
onmouseover 鼠标移入
onmouseup 鼠标按下松开
onmousedown 鼠标按下时发生
onmouseout 鼠标移出
onmousemove 鼠标移动时发生
事件默认行为
oncontextmenu 右键菜单事件，当右键菜单（环境菜单）显示出来的时候触发
键盘事件
HTML事件
onfocus ?表单获取焦点
onblur ??表单失去焦点
onchange 文本框内容改变失去焦点的时候触发
oninput 实时改变输入框的值
onselect 当用户选中文本框的内容时触发
onresize 当窗口大小变化时触发行为
onscroll 滚动滚动条
document.body.scrollTop 在IE中有用
document.documentElement.scrollTop ?非IE中有用
事件对象event
var e=ev || window.event //兼容IE浏览器
事件绑定，监听
IE（非标准浏览器）
attachEvent(事件名称，事件函数) 绑定事件处理函数
detachEvent(事件名称，事件函数) 解除绑定
DOM方式（标准浏览器）
addEventListener(事件名称，事件函数，是否捕获) 绑定、捕获事件
removeEventListener(事件名称，事件函数，是否捕获) 解除绑定
true=捕获
false=冒泡
设置，释放全局捕获
setCapture() 设置全局捕获
releaseCapture() 释放全局捕获
js-事件
原文地址：https://www.cnblogs.com/nannanxiaogege/p/9973153.html