day-2.1 事件函数

事件：是当事人，在特定的事件在特点的地点发生了某事。

一、JS语法中的事件函数：

1、事件函数代码块的理解：

元素.事件属性 =  事件函数；

元素.事件属性 即dom为各个元素定义好的一些事件属性，事件属性的事件指的的是html文档(元素)发生某个事件，事件属性后面跟是函数的话，即表示html发生了这个元素事件之后执行如下函数，一般元素事件后加函数才有意义。

2、以onload事件属性举例

下述为onload事件属性代码，由于div元素位于JS代码之后，JS代码如果想获取到div元素对象，需要等页面的html元素加载完成后再执行js的获取元素对象代码。不然获取的值为null。

代码执行的过程可以这么理解：

当代码执行到Window.onload这个事件代码块的时候，先为系统事件window.onload 注册了一个function，直到代码执行到</body>，整个window.全部onload完之后，事件触发，执行函数。

所有的事件函数的事件主体都可以为任何元素节点，比如 var oImg = document.getElementByTagName("img"); oImg.onload= function(){.........}的意思就是当图片加载完后，触发函数function(){...........}。

 1 <head>
 2     <script>
 3          //onload当页面的内容全部加载完成之后触发
 4           window.onload = function () {
 5              var oWrap = document.getElementById("wrap");
 6              console.log(oWrap);
 7             };
 8     </script>
 9 </head>
10 <body>
11     <div id="wrap"></div>
12 </body>

二、JS中的所有事件属性：

1、鼠标事件：

onclick左键单击，ondbclick 左键双击 ，onmouseenter (onmouseover)鼠标移入，onmouseleave(onmouseout)鼠标移出，

omousedown 鼠标按下，onmousemove 鼠标移动，onmouseup 鼠标抬起 ，oncontextmenu 右键单击；

2、键盘事件：

onkeydown(onkeypress) 键盘按下 ， onkeyup 键盘弹起 ；

3、系统事件：

onload 加载完成后，onerror 加载出错后 ，onresize 窗口调整大小时 ，onscroll 滚动时；

4、表单事件：

onfocus 获取焦点后 ，onblur 失去焦点后，onchange 改变内容后 ，onreset 重置后 ，onselect 选择后 ，onsubmit 提交后。

 

posted @ 2018-05-16 02:07  bibiguo  阅读(197)  评论(0)    收藏  举报