JavaScript brug

<script>-tagget

I HTML skal JavaScript-kode være placeret i <script> med </script> mellem tagene.

Eksempel

<script>
document.getElementById("demo").innerHTML = "min første JavaScript-sektion";
</script>

prøve det selv

Bemærk:Gamle JavaScript eksempler kan bruge type egenskab: <script type="text/javascript">.

Bemærk:type egenskab er ikke nødvendig. JavaScript er standard scriptsprog i HTML.

JavaScript funktioner og begivenheder

JavaScript funktioner en JavaScript kodeblok, der kan udføres, når den kaldes.

For eksempel, når der skerbegivenhederkalde funktioner, såsom når brugeren klikker på en knap.

Bemærk:Du vil lære mere om funktioner og begivenheder i senere kapitler.

<head> eller <body> JavaScript

Du kan placere et hvilket som helst antal scripts i HTML-dokumentet.

Script kan placeres i HTML-sidens <body> eller <head> delen, eller begge dele.

<head> JavaScript

I dette eksempel er JavaScript-funktionen placeret i HTML-sidens <head> Del.

Denne funktion vil blive kaldt, når knappen trykkes:

Eksempel

<!DOCTYPE html>
<html>
<head>
<script>
function myFunction() {
    document.getElementById("demo").innerHTML = "Paragrafen er ændret.";
}
</script>
</head>
<body>
<h1>En webside</h1>
<p id="demo">En afsnit</p>
<button type="button" onclick="myFunction()">Prøv det</button>
</body>
</html>

prøve det selv

<body> JavaScript

I dette eksempel er JavaScript-funktionen placeret i HTML-sidens <body> Del.

Denne funktion vil blive kaldt, når knappen trykkes:

Eksempel

<!DOCTYPE html>
<html>
<body> 
<h1>En webside</h1>
<p id="demo">En afsnit</p>
<button type="button" onclick="myFunction()">Prøv det</button>
<script>
function myFunction() {
   document.getElementById("demo").innerHTML = "Paragrafen er ændret.";
}
</script>
</body>
</html>

prøve det selv

Bemærk:Placer scriptet <body> elementets bund, hvilket kan forbedre visningshastigheden, fordi scriptkompilering kan forsinke visningen.

Eksterne scripts

Script kan placeres i eksternt fil:

Eksternt fil: myScript.js

function myFunction() {
   document.getElementById("demo").innerHTML = "Paragrafen er ændret.";
}

Eksterne scripts er meget nyttige, hvis det samme script bruges på mange forskellige websider.

JavaScript-filers filudvidelse er .js.

Hvis du bruger eksterne scripts, skal du <script> tags src (kilde) egenskab for at sætte scriptets navn:

Eksempel

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

prøve det selv

Du kan placere <head> eller <body> eksterne script referencer.

Scriptets opførsel afhænger af, hvor det placeres <script> det er det samme i tagget.

Bemærk:Eksterne scripts kan ikke indeholde <script> etiketter.

Fordelene ved eksternt JavaScript

Der er følgende fordele ved at placere script i eksterne filer:

  • Separerer HTML og kode
  • Gør HTML og JavaScript lettere at læse og vedligeholde
  • Cacherede JavaScript-filer kan accelerere indlæsning af sider

Hvis du vil tilføje flere skriptfiler til en side, skal du bruge flere script-tags:

Eksempel

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

Eksterne referencer

Eksterne skript kan refereres ved hjælp af en fuld URL eller en relativ sti i forhold til den aktuelle side:

Dette eksempel bruger en fuld URL til at linke til skriptet:

Eksempel

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

prøve det selv

Dette eksempel bruger en skriptfil, der befinder sig i en specificeret mappe på den aktuelle hjemmeside:

Eksempel

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

prøve det selv

Dette eksempel linker til en skriptfil i samme mappe som den aktuelle side:

Eksempel

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

prøve det selv

Du kan HTML-filstilær mere om filstier her.