【JavaScript】DOM事件

事件：电脑输入设备与页面进行交互的响应

一、常见事件：

1、onload ：
完成加载事件，页面加载完成之后，常用于做页面js代码初始化操作
2、onclick：
单击事件，常用于按钮的点击相应操作
3、onblur：
失去焦点事件，常用于输入框失去焦点，后验证其输入内容是否合法
4、onchange：
内容发生改变事件，常用于下拉列表和输入框内容发生改变后操作
5、onsubmit：
常用于表单提交前，验证表单项是否合法

二、事件注册（绑定）:

告诉浏览器，当事件响应后要执行哪些操作代码。

静态事件注册： 通过html标签的事件属性直接赋于事件响应后的代码

动态事件注册： 先通过js代码得到对象的dom对象，然后通过
dom对象名.事件名=function(){}
动态注册基本步骤：
1、获取标签对象
2、标签对象.事件名=function(){}

例：

<script>
   //静态注册onclick事件
   function onclickFun(){
      alert("静态注册onclick事件");
    }
   //动态注册onclick事件
    window.onload=function () {
      //1、获取标签对象
      /*
       * document: javascript语言提供的一个对象(文档) 指的整个页面所有的内容
       * getElementById: 通过id属性获取标签对象
       */
      var btnObj=document.getElementById("btn01");
      //2、通过标签对象.事件名=function(){}
      btnObj.onclick=function () {
        alert("动态注册的onclick事件");
      }
    }
</script>

<body>
<!-- 静态注册onclick事件-->
<button onclick="onclickFun()">按钮1</button>
<!-- 动态注册onclick事件-->
<button id="btn01">按钮2</button>

</body>

单击按钮1：

单击按钮2：