JavaScript Gebruik

<script>-tag

In HTML moet JavaScript-code zich bevinden in <script> met </script> tussen de tags.

Voorbeeld

<script>
document.getElementById("demo").innerHTML = "mijn eerste JavaScript-segment";
</script>

Probeer het zelf

Opmerking:kunnen gebruiken Oude voorbeelden van JavaScript zouden type

Opmerking:eigenschap: <script type="text/javascript">.

Het type-eigenschap is niet vereist. JavaScript is het standaard scripttaal in HTML.

JavaScript-functies en evenementen JavaScriptfunctie

is een blok JavaScript-code dat uitgevoerd kan worden wanneer het wordt aangeroepen.Bijvoorbeeld, wanneerevenementen

Tip:functies worden aangeroepen, zoals wanneer de gebruiker op een knop klikt.

U zult later meer leren over functies en evenementen.

<head> of <body> van de JavaScript

U kunt een onbeperkt aantal scripts plaatsen in het HTML-document. <body> of <head> Het script kan worden geplaatst in het

deel van de

In dit voorbeeld wordt de JavaScript-functie geplaatst in de <head> deel.

Deze functie wordt aangeroepen wanneer de knop wordt ingedrukt:

Voorbeeld

<!DOCTYPE html>
<html>
<head>
<script>
function myFunction() {
    document.getElementById("demo").innerHTML = "De paragraaf is gewijzigd.";
}
</script>
</head>
<body>
<h1>Een webpagina</h1>
<p id="demo">Een paragraaf</p>
<button type="button" onclick="myFunction()">Probeer het uit</button>
</body>
</html>

Probeer het zelf

<body> van de HTML-pagina.

In dit voorbeeld wordt de JavaScript-functie geplaatst in de <body> deel.

Deze functie wordt aangeroepen wanneer de knop wordt ingedrukt:

Voorbeeld

<!DOCTYPE html>
<html>
<body> 
<h1>Een Webpagina</h1>
<p id="demo">Een paragraaf</p>
<button type="button" onclick="myFunction()">Probeer het uit</button>
<script>
function myFunction() {
   document.getElementById("demo").innerHTML = "De paragraaf is gewijzigd.";
}
</script>
</body>
</html>

Probeer het zelf

Tip:Plaats het script in <body> onderaan het element, wat de weergave kan verbeteren, omdat het compileren van het script de weergave kan vertragen.

Externe script

Het script kan worden geplaatst in het externe bestand:

Externe bestand: myScript.js

function myFunction() {
   document.getElementById("demo").innerHTML = "De paragraaf is gewijzigd.";
}

Externe scripts zijn handig, als dezelfde script op veel verschillende webpagina's wordt gebruikt.

De bestandsextensie van JavaScript-bestanden is .js.

Gebruikt u externe scripts, <script> van de tag instellen: src in het

Voorbeeld

<script src="myScript.js"></script>

Probeer het zelf

U kunt <head> of <body> extern script verwijzing geplaatst wordt.

De prestaties van dit script zijn afhankelijk van waar <script> het is hetzelfde in de tag.

Opmerking:Externe scripts mogen geen <script> Tags.

Voordelen van externe JavaScript

Plaatsen van scripten in externe bestanden heeft de volgende voordelen:

  • Scheidt HTML en code
  • Maakt HTML en JavaScript gemakkelijker leesbaar en onderhoudbaar
  • Gecachte JavaScript-bestanden kunnen de laadtijd van de pagina versnellen

Om meerdere scriptbestanden aan een pagina toe te voegen - gebruik meerdere script tags:

Voorbeeld

<script src="myScript1.js"></script>
<script src="myScript2.js"></script>

Buitenste Referentie

Buitenste scripts kunnen worden geciteerd via een volledige URL of een pad ten opzichte van de huidige pagina:

Dit voorbeeld gebruikt een volledige URL om naar het script te linken:

Voorbeeld

<script src="https://www.codew3c.com/js/myScript1.js"></script>

Probeer het zelf

Dit voorbeeld gebruikt een script uit de gespecificeerde map op de huidige site:

Voorbeeld

<script src="/js/myScript1.js"></script>

Probeer het zelf

Dit voorbeeld verbindt een script met dezelfde map als de huidige pagina:

Voorbeeld

<script src="myScript1.js"></script>

Probeer het zelf

Je kunt HTML BestandspadLeer meer over bestandspaden.