JAVASCRIPT Tutorial

Webbplatsutveckling i JS

Steps:

  1. Förstå HTML och CSS HTML strukturerar innehållet på en webbsida, medan CSS ger den dess utseende och stil.
  2. Ta reda på DOM DOM (Dokumentobjektmodellen) representerar webbsidan som en trädstruktur. Den gör det möjligt att interagera med sidans element.
  3. Hantera händelser Händelser är åtgärder som utlöser JavaScript-kod, t.ex. klick, musrörelser och laddning av sidor.
  4. Använd AJAX AJAX (Asyncron JavaScript och XML) gör det möjligt för JavaScript att hämta data från en server utan att ladda om sidan.
  5. Integrera JavaScript i webbsidor
    • Extern fil: <script src="script.js"></script>
    • Inline-kod: <script>kod här</script>

Enkel JavaScript-exempel

// Hämta ett HTML-element
let knapp = document.querySelector('button');

// Lägg till en eventlyssnare till knappen
knapp.addEventListener('click', () => {
  // Interagera med HTML-elementen
  let rubrik = document.querySelector('h1');
  rubrik.innerHTML = 'Hej, JavaScript!';
});

Tips för tillgänglighet

  • Använd semantiska HTML-element (t.ex. <header> för rubriker).
  • Tillhandahåll alternativa textbeskrivningar (alt-text) för bilder.
  • Kontrastera text- och bakgrundsfärger för läsbarhet.