Gå til innhold

Introduksjon til JavaScript

JavaScript (JS) er programmeringsspråket som gjør nettsider interaktive og dynamiske. Mens HTML definerer innholdet og CSS bestemmer utseendet, er det JavaScript som får ting til å skje - klikk, animasjoner, validering og mer.

Hva er JavaScript?

JavaScript er et av de tre grunnleggende språkene i webutvikling:

Teknologi Rolle Analogi
HTML Struktur og innhold Skjelettet
CSS Utseende og layout Klærne
JavaScript Interaktivitet Musklene

Når du klikker på en knapp og noe skjer, er det JavaScript. Når innhold på en side endrer seg uten at du laster siden på nytt, er det JavaScript. Når et skjema sjekker om du har fylt inn e-postadressen riktig - du gjettet det - JavaScript.

Hvordan fungerer JavaScript?

JavaScript kjøres direkte i nettleseren din (FireFox, Chrome, Safari). Når nettleseren laster en nettside, leser den HTML og CSS for å bygge opp siden, og deretter kjører den JavaScript-koden.

1. Nettleseren laster HTML     → Bygger opp innholdet
2. Nettleseren laster CSS      → Legger til stil
3. Nettleseren kjører JavaScript → Gjør siden interaktiv

Grunnleggende syntaks

JavaScript-kode består av instruksjoner (statements) som nettleseren utfører linje for linje.

// Dette er en kommentar - nettleseren ignorerer den

/* Dette er en
   flerlinjet kommentar */

console.log("Hei, verden!");  // Skriver tekst til konsollen

Semikolon

Hver linje avsluttes med semikolon ;. Som oftest virker det også uten, men det er en god vane å alltid bruke det.

Hello world med JavaScript

Programmet nedenfor er et helt enkelt eksempel på et JavaScript program.

alert("Hei, verden!");

Hva skjer her?

  • alert er en innebygd funksjon som viser en popup-boks i nettleseren
  • ( og ) brukes for å sende data til funksjonen
  • "Hei, verden!" er en tekststreng - tekst mellom anførselstegn
  • ; avslutter instruksjonen

Prøv det! Åpne utviklerverktøyene i nettleseren din (F12), gå til Console, og skriv inn alert("Hei, verden!").

Nyttige funksjoner å starte med

Funksjon Hva den gjør Eksempel
alert() Viser en popup-boks alert("Hei!")
console.log() Skriver til konsollen console.log("Test")
prompt() Ber brukeren om input prompt("Hva heter du?") 
// Be brukeren om navnet sitt
let navn = prompt("Hva heter du?");

// Vis en hilsen
alert("Hei, " + navn + "!");

// Skriv til konsollen
console.log("Brukeren heter: " + navn);

Kom i gang

  1. Lag en fil script.js
  2. Koble den til HTML med <script src="../script.js"></script> (mer om dette på neste side)
  3. Åpne utviklerverktøyene i nettleseren (F12) for å se output i konsollen
  4. Start med enkle console.log() for å teste
// script.js
console.log("JavaScript fungerer!");

let navn = prompt("Hva heter du?");
alert("Hei, " + navn + "!");