常用事件类型

change事件(只针对表单)

如果标签内容value值发生改变，并且失去焦距触发
input 中的text checkbox radio

select(下拉菜单) select.value是选中的值
select会有多选(multiple)的可能性,这样会导致value一直是第一次选中的值
select.selectedOptions 被选择的多个元素
select.selectedIndex 选择下标

load error 用于图片的加载，ajax的通信以及JSON或者其他文件的加载

load是加载成功
error 是加载错误
var img=new Image() //document.createElement(“img”);
任何内容没有放在页面中，不能调用clientWidth，offsetWidth,scrollWidth。

img.addEventListener(“load”,loadHandler)
img.addEventListener(“error”,errorHandler)

load还可以用于window加载创建完成。使用window侦听load事件，意味着：
所有DOM加载完成，所有图片加载完成
window.addEventListener(“load”,loadHandler);
function loadHandler(e){
这里的函数是window中的所有DOM加载完成后执行的函数
}

reset submit

只能针对form表单侦听，不能针对input
form.addEventListener(“submit”,submitHandler);

function submitHandler(e){
e.preventDefault();
e.returnValue=false 兼容写法
}

resize

针对window和textArea
window.addEventListener(“resize”,resizeHandler)
function resizeHandler(e){
当窗口大小改变时收到事件
}
rem 相对于HTML的fontsize
html.fontsize=html.width/screen100
document.documentElement.style.fontSize=document.documentElement.clientWidth/screen.width100+“px”;

select

只针对input，input文本选择文字时触发
var input=document.querySelector(“input”);
input.addEventListener(“select”,selectHandler);
// input文本选择文字时触发
function selectHandler(e){
// console.log(“aa”);
// console.log(input.selectionStart);
// console.log(input.selectionEnd);
input.value=input.value.slice(0,input.selectionStart)+input.value.slice(input.selectionEnd);
}

scroll

滚到条位置改变时触发

popstate

当历史记录被回退和前进时触发
window.addEventListener(“popstate”,popstateHandler)
history.pushState({a:1},"","#1")