js --- イベント

イベントの 3 つの要素: イベントソース、イベントタイプ、イベントハンドラー

btn.onclick=function(){}
btn:事件源
click：事件类型
function：事件处理函数

バインディングイベント:

方法 1: DOM レベル 0 イベントバインディング
構文: イベントソース.on イベントタイプ = イベント処理関数
特徴: 同じイベントソースの同じイベントタイプは 1 つのイベント処理関数にのみバインドできます。数が多すぎる場合は、
方法 2を上書きします。 : DOM レベル 2 イベントバインディング (イベントリスニング構文)
標準ブラウザ:
構文: イベント Source.addEventListener('イベントタイプ','イベントハンドラー関数')
特徴: 複数の関数が同じタイムソースの同じイベントタイプにバインドされます。順序バインド、順次実行
IE ブラウザ:
構文: イベント Source.attachEvent('on イベントタイプ','イベントハンドラー関数')
機能: 複数のバインド、順次バインド、逆順序実行も可能

アンバインドイベント:

方法 1: DOM レベル 0: イベントソース.on イベントタイプ=null
方法 2: DOM レベル 2: イベントソース.addEventListener('イベントタイプ','バインド解除されるイベントハンドラー')

関数がメモリ内でどのように動作するか:

基本データ型: スタック領域に格納されます。
複雑なデータ型: 通常、変数名はスタック領域に格納され、データはヒープ領域に格納され、最後にヒープ領域のアドレスが変数名に与えられます。

    var num = 10
    var num2 = 100
    function fn(){
        console.log('fn');
    }

一般的なイベントの種類

 依赖于鼠标行为而触发的一些事件类型
 1.click====鼠标左键单击
 2.dblclick====鼠标左键双击，双击执行1次，单击执行2次
 3.contextmenu====鼠标的右键单击
 4.mousedown====鼠标按下
 5.mouseup====鼠标抬起
 6.mousemove===鼠标移动，大概1s会触发60次左右
 7.mouseover=====鼠标移入===子元素也会触发
 8.mouseout=====鼠标移出===子元素也会触发
 9.mouseenter====鼠标移入===子元素不会触发
 10.mouseleave====鼠标移除===子元素不会触发

依赖键盘行为触发的事件
所有的元素都可以绑定键盘事件，但是不一定都能触发。，
所以一般键盘事件都选择绑定在window、document、表单元素等可以选择的元素上
1.keydown======只要键盘按下了，就触发
2.keyup=====只要键盘抬起了，就触发
3.keypress====键盘键入事件
    按下的按键真的会出现文本内容才可以,比如按上下左右键就不会触发
    按下的内容必须要和出现的内容是一致的才可以
    但是：回车键可以触发

表单事件：依赖于表单行为触发的事件
1.focus======表单聚焦事件（得到焦点就触发）
2.blur======表单失焦事件（失去焦点就触发）
3.change=====表单内容改变事件（聚焦和失焦的时候内容不一致就会触发）
4.input事件====表单输入事件（实时触发，只要有输入行为或者删除行为就触发）
5.submit事件====表单提交事件（只有form才有提交行为，所以需要绑定给form）
6.reset事件====表达的重置事件（只有form才有重置行为。所以需要绑定给form）

おすすめ