logo

Hur anropar jag JavaScript-funktion i html?

Det finns många sätt att anropa en JavaScript-funktion i HTML-dokumentet, och det är inte heller en svår uppgift. Först har vi använt ett av de enklaste sätten att ringa en JavaScript funktion i HTML-dokument:

I denna metod kommer vi att skapa och definiera en funktion i HTML-dokumentets huvudsektion. För att anropa denna funktion i html-dokumentet måste vi skapa en enkel knapp och använda onclick händelseattribut (som är en händelsehanterare) tillsammans med det kan vi anropa funktionen genom att klicka på knappen.

För att förstå det tydligare låt oss se det givna programmet:

Program

java-ingång
 functionmyfunction() { alert(&apos;how are you&apos;); } <p>Click the following button to see the function in action</p> 

Förklaring av programmet

I det ovan angivna programmet har vi skapat ett enkelt HTML-dokument. Inuti huvudsektionen av HTML-dokumentet har vi definierat en funktion ( t.ex. min funktion();) inuti skripttaggarna ... .

 function myfunction() { alert(&apos;how are you&apos;); } 

Å andra sidan, inne i brödsektionen visade vi lite text och skapade en knapp. För att kalla vår funktion har vi använt onclick attribut tillsammans med knappen och när användaren klickar på den knappen körs vår funktion och visar ett varningsmeddelande, som du kan se i utgången.

Klicka på följande knapp för att se funktionen i funktion

Produktion

Hur man anropar JavaScript-funktion i html

Anropa en funktion med hjälp av extern JavaScript-fil

Vi kan också anropa JavaScript-funktioner med hjälp av en extern JavaScript-fil bifogad till vårt HTML-dokument. För att göra detta måste vi först skapa en JavaScript-fil och definiera vår funktion i den och spara den med tillägget (.Js).

När JavaScript-filen har skapats måste vi skapa ett enkelt HTML-dokument. För att inkludera vår JavaScript-fil i HTML-dokumentet måste vi använda script-taggen och i attributet 'src' måste vi ange sökvägen till vår JavaScript-fil där den lagras. Efter att ha länkat den externa JavaScript-filen till HTML-dokumentet kan vi skapa en knapp och anropa fungera använda 'onclick' attribut med det.

Låt oss förstå det med hjälp av ett program:

Program

Klicka på följande knapp för att se funktionen i funktion

Förklaring av programmet

I programmet ovan har vi först skapat en JavaScript-fil och definierat vår funktion i den och sparat den med . js förlängning.

Function.js

 functionmyfunction() { document.write(&apos;welcome to Javatpoint&apos;); } 

Efter att ha skapat JavaScript-filen har vi skapat ett HTML-dokument och länkat vår JavaScript-fil med . Eftersom vi har lagrat vårt HTML-dokument och JavaScript-filen i samma mapp, har vi precis döpt vår JavaScript-fil till attributet 'scr' istället för att ange hela sökvägen i huvudsektionen.

 

Inne i brödsektionen visade vi lite text och skapade en knapp. För att kalla vår funktion har vi använt onclick attribut tillsammans med knappen och när användaren klickar på den knappen körs vår funktion och visar ett varningsmeddelande, som du kan se i utgången.

Klicka på följande knapp för att se funktionen i funktion

Produktion

Hur man anropar JavaScript-funktion i html

Klicka nu på den givna knappen:

Hur man anropar JavaScript-funktion i html