Como chamar a função JavaScript no HTML usando o método OnClick?

Como chamar a função JavaScript no HTML usando o método OnClick?
Programação é tudo sobre eficiência. A repetição dentro de um código sempre foi desaprovada por desenvolvedores em todo o mundo. Para cumprir esse objetivo, existe algo chamado funções na programação. Então, o que exatamente é uma função? As funções podem ser vistas como um código de código que o desenvolvedor cria em seu programa. Esta função que foi criada uma vez pode ser utilizada várias vezes, apenas usando o nome dessa função. No desenvolvimento da web, as funções são criadas dentro do JavaScript, mas podem ser usadas no código HTML.

Neste artigo, alguma luz será lançada sobre como uma função que existe no JavaScript, pode ser acessada pela seção HTML.

Chamando qualquer função JS no código HTML

Ao enfrentar funções em JavaScript, dois cenários distintos se destacarão. Esta seção mostrará como você pode chamar qualquer função JavaScript em qualquer um desses dois casos.

JavaScript dentro do arquivo html

Quando a função JavaScript existe dentro do mesmo arquivo que o código HTML, é bastante simples acessá -lo e chamá -lo de HTML. Vamos ver o código de amostra abaixo:






Clique neste botão para chamar a função JavaScript dentro de HTML




Dentro da seção JavaScript deste código, é formada uma função que tem o nome “Função de amostra”. A função deve executar um alerta quando chamado. Dentro do corpo principal do código HTML, um botão é criado. Os botões têm um “ONCLICK”Recurso que lhes permite chamar funções do código JS. Vamos utilizar o nome “Função de amostra”Que será usado para chamá -lo no“ONCLICK" recurso. Confira o exemplo abaixo:

A saída é a seguinte:

JavaScript dentro de um arquivo externo

Na maioria dos casos, as funções JavaScript não estão presentes no mesmo arquivo que o código HTML. Em casos como este, os dois arquivos precisam ser vinculados para que o código HTML possa chamar funções de JavaScript. Este código abaixo representa o arquivo JavaScript:

função samplefunction ()
documento.Write ("A função foi chamada!");

No arquivo JavaScript, a função foi criada. Esta função agora pode ser chamada em um arquivo HTML quantas vezes que o desenvolvedor deseja. O código abaixo mostra o arquivo HTML:






Clique neste botão para chamar a função JavaScript dentro de HTML




Aqui, vinculamos o arquivo JavaScript chamado “JSFILE.JS”Com o arquivo html usando o“src”Palavra -chave dentro das tags de script. Fazer isso permitirá o “ONCLICK”Função abaixo para acessar a função do arquivo JS.

Conclusão

Existem duas maneiras de alcançar uma função JavaScript dentro de HTML. O primeiro é usar o “ONCLICK”Recurso de um botão para chamar a função que já está presente dentro do arquivo html. O segundo está vinculando o arquivo JavaScript externo ao arquivo HTML usando a palavra -chave "SRC". Neste artigo, você aprendeu os dois cenários diferentes nos quais precisará acessar uma função da JavaScript dentro de Html.