Leituras relacionadas:
Javascript Event Learning Resumo (v) Tipo de evento do mouse em JS
//www.vevb.com/article/86259.htm
Javascript Event Learning Resumo (i) Fluxo de eventos
//www.vevb.com/article/86261.htm
Javascript Event Learning Resumo (iv) Membros públicos do evento (propriedades e métodos)
//www.vevb.com/article/86262.htm
Javascript Event Learning Resumo (ii) JS Eventador de eventos
//www.vevb.com/article/86264.htm
Javascript Event Learning Resumo (iii) Objeto de evento JS
//www.vevb.com/article/86266.htm
1. Objeto de evento
1. Entenda o objeto de evento
Os eventos existem no navegador como objetos, ou seja, evento. O acionamento de um evento gerará um evento de objeto de evento, que contém todas as informações relacionadas ao evento. Inclui os elementos que resultam no evento, o tipo de evento e outras informações relacionadas a um evento específico.
Por exemplo: o evento gerado pela operação do mouse conterá informações sobre a posição do mouse; O evento gerado pela operação do teclado conterá informações relacionadas à tecla pressionada.
Todos os navegadores suportam objetos de eventos, mas os métodos de suporte são diferentes. No DOM, os objetos do evento devem ser passados para funções de manuseio de eventos como parâmetros exclusivos. No IE, o evento é um atributo de objetos de janela.
2. Evento no manipulador de eventos HTML
<input id = "btn" type = "button" value = "click" onclick = "console.log ('html event manipulador'+event.type)"/>Isso cria uma função que contém o evento de variável local. O objeto de evento pode ser acessado diretamente através do evento.
3. Objetos de eventos em DOM
Os manipuladores de eventos no nível DOM0 e o nível DOM2 serão aprovados como parâmetros.
<Body> <input id = "btn" type = "button" value = "clique"/> <cript> var btn = document.getElementById ("btn"); btn.onClick = function (event) {console.log ("dom0 & click"); console.log (event.type); //clickingbtn.addeventListener("Click ", function (event) {console.log (" dom2 & click "); console.log (event.type); // clique}, false); </script> </body>4. Objetos de eventos no IE
O primeiro caso: ao adicionar um manipulador de eventos através do método do nível DOM0, o objeto de evento existe como um atributo do objeto da janela.
<Body> <input id = "btn" type = "button" value = "clique"/> <cript> var btn = document.getElementById ("btn"); btn.onClick = function () {var event = window.event; console.log (event.type); // Clique em} </sCript> </body>O segundo caso: o manipulador de eventos adicionado através do AnexeEvent () e o objeto de evento é passado como um parâmetro.
<Body> <input id = "btn" type = "button" value = "click"/> <cript> var btn = document.getElementById ("btn");Mas não entendo duas coisas.
1. Um parâmetro de evento também pode ser passado para o manipulador de eventos adicionado através do método de nível DOM0. Seu tipo é o mesmo que Window.Event.Type, mas o parâmetro de evento passado é diferente do Window.Event. Por que?
btn.OnClick = function (event) {var evento1 = window.event; console.log ('event1.type ='+event1.type); //event1.type=clickconsole.log('event.type='+Event.type); //event.type=clickconsole.log('event1==event?'+(vent==Event1)); // Event1 == Evento? False}2. O evento aprovado no manipulador de eventos adicionado através do AnextEvent é diferente do Window.Event. Por que?
<Body> <input id = "btn" type = "button" value = "click"/> <cript> var btn = document.getElementById ("btn"); btn.attachevent ("onclick", function (type) {console.log (event.type); //clickconsole.log("event==window.event?"+(event==window.event));O exposto acima é o resumo do conhecimento relacionado ao Javascript Event Learning (III) sobre os objetos de evento JS introduzidos pelo editor. Espero que seja útil para todos. Se você quiser saber mais, preste atenção no site do Wulin.com!