Como adicionar JavaScript ao HTML

JavaScript é uma das linguagens de script que é usada para fazer páginas da web interativas e modernas. Sem a necessidade de plugins adicionais, os navegadores da web modernos suportam JavaScript com motores embutidos.

Além disso, enquanto trabalha com arquivos da Web, o JavaScript precisa ser executado junto com o HTML. Isso pode ser feito incluindo o código JavaScript embutido na tag do arquivo html ou você pode adicionar JavaScript através de um arquivo externo. Tag JavaScript usado na seção principal do arquivo html ou na seção do corpo, depende apenas de onde você deseja carregar JavaScript. JavaScript pode ser escrito dentro de tags para manter fora do conteúdo principal dos arquivos HTML. Se você precisar de JavaScript para executar em um layout da página da web, o script geralmente é chamado para a seção do corpo.

JavaScript pode ser usado de várias maneiras em páginas da web, como a validação do formulário, criando alertas de aviso e muito mais. Neste artigo, examinaremos como incorporar JavaScript nos arquivos HTML em profundidade.

A seguir estão as maneiras de incorporar JavaScript nos arquivos HTML.

Incorporar código

A tag… é usada para adicionar javascript às páginas da web, o que ajuda a embrulhar JavaScript nos programas HTML. O código de JavaScript pode estar na seção do corpo ou na seção da cabeça, dependendo da estrutura do aplicativo.

Exemplo 1: JavaScript na seção da cabeça

Este exemplo mostra como incluir JavaScript na seção principal

Saída:

Exemplo2: JavaScript na seção corporal

Este exemplo mostra como incluir JavaScript na seção do corpo

Saída:

Código embutido

Quando você precisa chamar uma função em atributos HTML, um código em linha de JavaScript é usado. O código JavaScript pode ser usado diretamente em vários eventos como OnMouseOver (), OnClick () e muito mais. Os principais pontos devem ser lembrados ao usar scripts embutidos:

• Útil para pequenos scripts ou scripts que apenas executam em um arquivo.
• Difícil de ler e entender se os scripts são maiores ou usados ​​em várias páginas.

Exemplo 1: Este exemplo mostra como incorporar JavaScript em HTML sem tags.

Código embutido

Este exemplo mostra como incluir javascript embutido sem tags de script.

Saída:

Exemplo2:

No exemplo acima, sempre que o usuário carrega a página da web, o script exibe uma mensagem de alerta mostrando a data atual.

Saída:

Arquivo externo

O código JavaScript pode ser escrito em um arquivo separado com uma extensão de “.JS ”e depois incluído no arquivo HTML. O nome do arquivo javascript pode ser incluído no atributo "SRC" do script. Arquivos externos do código JavaScript podem ser reutilizáveis. Portanto, os arquivos separados para o código JavaScript salvam você de reescrever o mesmo programa de software. Arquivos externos são muito mais fáceis de gerenciar.

Exemplo:

Neste exemplo, existem dois arquivos, índice.html e datescript.JS. Arquivo externo i.e. datescript.JS incluído na seção corporal do arquivo html nomeado como índice.html. JavaScript chamado datescript.O JS é usado para mostrar a data atual sempre que o usuário carrega a página da web. Ambos .html e .Os arquivos JS são colocados na mesma pasta.

Índice.html

Datescript.JS

Let Date = new Date ();
documento.corpo.INNERHTML = "

Data: " + Data +"

"

Saída:

Conclusão

Neste artigo, demonstramos como adicionar JavaScript aos arquivos HTML. Posteriormente, discutimos cada método aprofundado para incorporar JavaScript em suas páginas da web. Discutimos três maneiras de adicionar JavaScript aos arquivos html i.e. Código em linha, arquivos externos e código de incorporação. Exemplos também são fornecidos para cada método para ajudá -lo a entender.