3.1. Como ocorrem os eventos*
No primeiro caso, o usuário faz certas operações na página da web, como clicar em um botão para gerar um evento de clique. No segundo caso, se o usuário não tiver operado na página da web, também poderá ocorrer um evento. Por exemplo, o navegador carregou a página inteira, que gerará um evento de conclusão de carga. Após a geração do evento, o navegador procurará se o nó que gerou o evento limitou o código de processamento de eventos correspondente. Nesse caso, o código é chamado para lidar com isso. Caso contrário, o nó pai continuará sendo pesquisado para cima e não há código de processamento de eventos correspondente (bolhas de eventos).
3.2. Código de processamento de eventos de ligação **
1) Ligue o código de processamento de eventos à tag html
Por exemplo: <a id = "a1" href = "" onclick = "f1 ();"> clique </a>
2) Ligue o código de processamento de eventos ao nó DOM
var obj = document.getElementById ('A1'); obj.OnClick = f1;
Perceber:
um. Não adicione "()" à F1. Adicionar "()" significa que a F1 é executada imediatamente.
b. A ligação da linha da função anônima pode ser usada.
Isto é: obj.onclick = function () {// code. }
c. O código de processamento de eventos de ligação ao nó DOM pode separar completamente o código JS sem HTML, o que é conveniente para a manutenção do código.
d. Se você deseja passar os parâmetros para a função vinculada. Funções anônimas podem ser resolvidas.
Isto é: obj.onclick = function () {f (parâmetro); }
3) Use o próprio método de ligação do navegador (compreenda)
Diferentes navegadores têm seus próprios métodos de ligação exclusivos e, por serem incompatíveis, tentam usá -los o mínimo possível.
Scripts scripts podem ser escritos em <body>
Equivalente à figura a seguir
E se os parâmetros forem passados? Use funções anônimas
[Caso 3.1] Código de processamento de eventos de ligação para a tag html superior **
3.3. Objeto de evento ***
1) Obtenha o objeto de evento
Ou seja, navegador: você pode usar o evento diretamente para obter
Firefox: você deve adicionar um evento de parâmetro ao método
Geralmente, para ser compatível com o IE e o Firefox, adicione um evento de parâmetro ao método.
2) O papel dos objetos do evento
um. Obtenha as coordenadas do clique do mouse
Event.ClientX Event.Clienty
b. Obtenha a fonte do evento (o objeto que gerou o evento)
Firefox: Event.Target Gets IE Browser: Event.srcelement Gets
3.4. Bolha de evento **
1) O que é bolha de eventos? Quando um evento é gerado por um nó, o evento será carregado para cima por sua vez (primeiro no nó pai, se o nó pai tiver um nó pai e depois o enviar para cima).
2) Como proibir bolhas? event.cancelbubble = true;
2) O fenômeno "Bubble de evento" fecha a caixa de diálogo "Você clicou em um link" e continua a aparecer na caixa de diálogo "Você clicou em uma div"
【Caso 3.4】 Objeto de evento **
<html>
<!-Objeto de evento->
--------------------------------------------------------------------------------------------------------------------------------------------------
O JS usa orientado a eventos para responder às operações do usuário.
Por exemplo, a operação executada em uma janela do navegador ou elemento da página da web (botão, caixa de texto ...) através do mouse ou tecla é chamada de evento (evento).
As ações de uma série de programas desencadeados pelo mouse ou pela tecla de atalho são chamados de Event-Driver.
Um manipulador ou função é usado para lidar com eventos, que chamamos de manipulador de eventos (manipulador de eventos).
--------------------------------------------------------------------------------------------------------------------------------------------------
Processamento de compatibilidade do navegador
<Script Language = "javascript"> <!- if (window.xmlhttprequest) {// mozilla, safari, ie7, ie8 if (! window.activexobject) {// mozilla, safari, alert ('mozilla, safari'); } else {alert ('ie7 .8'); }} else {alert ('ie6'); } //-> </script>-------------------------------------------------------------------------------continua
Um evento requer vários métodos, você pode usá -lo e separá -lo.
<input type = "button" value = "vermelho" onclick = "mychange (this), sayhello ()"/>
<corpo onkeydowndown = "showKey (event)" onLload = "abc ()" onunload = "abc2 ()">
O artigo acima sobre o método de compatibilidade do navegador do mecanismo orientado a eventos JS é todo o conteúdo que compartilho com você. Espero que você possa lhe dar uma referência e espero que você possa apoiar mais o wulin.com.