CodeGym/Cursos Java/Módulo 3/Interação do código JavaScript com o navegador

Interação do código JavaScript com o navegador

Disponível

4.1 Objetos do navegador

Como você já sabe, a linguagem JavaScript funciona dentro do navegador, então ela precisa de alguma forma interagir com esse mesmo navegador. Para fazer isso, o navegador possui vários objetos e funções disponíveis no JavaScript.

A primeira é an object window, que descreve a janela do navegador. Ou melhor, eu costumava descrever quando os navegadores ficavam sem abas. Agora, o objeto window descreve a guia atual do navegador na qual a página com o script é carregada.

Em segundo lugar, este é an object documento responsável pelo documento exibido na guia. Isso pode ser um pouco confuso. Para simplificar, digamos que documento é o que é exibido para o usuário e janela é o que esse documento é exibido.

Em terceiro lugar, este é an object consoleo responsável pela saída para o console do navegador. Sim, os navegadores também possuem um console, usado principalmente para depurar o script e exibir mensagens de erro. Normalmente, você pode abri-lo pressionando o botão F12 em seu navegador.

Object window, é o objeto de nível superior para todos os objetos de página. E embora você possa escrever nomes de objetos diretamente documentem consoleseu script, na verdade, seus nomes window.documente arquivos window.console.

4.2 Diálogos em JavaScript

método alert()

Ele também an object windowpossui várias funções que são visíveis para o script da página. O mais comumente usado é o alert(). Ele permite que você exiba uma caixa de diálogo com uma mensagem para o usuário. O script é suspenso até que o usuário clique em OK.

Exemplo:

alert("JavaScript is the best!");

método prompt()

Há também uma função com a qual você pode solicitar ao usuário que insira algum valor - isto é prompt().

Exemplo:

var age = prompt("Enter Year of Birth");

método confirm()

Você pode exibir uma caixa de diálogo com dois botões Ok- Cancelpergunte ao usuário sobre alguma ação.

Exemplo:

var isOK = confirm("Are you ready");

4.3 evento onload()

E mais um momento útil e interessante. A janela do navegador tem um evento que é acionado quando o documento é totalmente carregado. Você pode especificar o código a ser executado depois que o documento for carregado e exibido.

Isso pode ser feito de três maneiras.

Primeiro, você pode incorporar o código JavaScript diretamente em uma página HTML como um valor de atributo:

<body onload="alert('document loaded');">
  <img src="big-image.png">
</body>

Em segundo lugar, você pode incorporar código JavaScript simplesmente em uma página HTML:

<head>
    <script>
        function load()
        {
            alert('document loaded');
        }
        window.onload = load;
    </script>
</head>
<body>
    <img src="big-image.png">
</body>

Em terceiro lugar, podemos escrevê-lo um pouco mais curto declarando uma função anônima:

<head>
    <script>
        window.onload = function () {
            alert('document loaded');
        }
    </script>
</head>
<body>
    <img src="big-image.png">
</body>

4.4 evento onclick ()

E, finalmente, outro evento importante (evento) é event OnClick. Que ocorre em qualquer elemento em que o usuário clicou. Assim como event OnLoadpode ser definido de diferentes maneiras, daremos apenas o mais simples:

<body>
  <img src="big-image.png" onclick="alert('user clicked on the image');">
</body>

Comentários
  • Populares
  • Novas
  • Antigas
Você precisa acessar para deixar um comentário
Esta página ainda não tem nenhum comentário