Lesrooster

JS Handleiding

• JS Handleiding
• JS Inleiding
• JS Gebruik
• JS Uitvoeren
• JS Statement
• JS Syntax
• JS Commentaar
• JS Variabele
• JS Let
• JS Const
• JS operatoren
• JS wiskundige operaties
• JS toewijzing
• JS datatypes
• JS functie
• JS object
• JS gebeurtenissen
• JS string
• JS string methoden
• JS string zoeken
• JS string sjablonen
• JS getal
• JS BigInt
• JS numerieke methoden
• JS numerieke eigenschappen
• JS array
• JS array methoden
• JS array zoeken
• JS array sorteren
• JS array itereren
• JS array Const
• JS datum
• JS datum opmaak
• JS datum ophalen methoden
• JS datum instellen methoden
• JS wiskunde
• JS willekeurig
• JS logica
• JS vergelijking
• JS voorwaarden
• JS Switch
• JS Loop For
• JS Loop For In
• JS Loop For Of
• JS Loop While
• JS Break
• JS iterable objecten
• JS Set
• JS Set methoden
• JS Map
• JS Map methoden
• JS typeof
• JS type conversie
• JS destructie
• JS bit operaties
• JS reguliere expressies
• JS operator prioriteit
• JS uitzonderingen
• JS bereik
• JS Hoisting
• JS strikt modus
• JS this sleutelwoord
• JS pijlfuncties
• JS klasse
• JS modules
• JS JSON
• JS debuggen
• JS stijlgids
• JS beste praktijken
• JS fouten
• JS prestaties
• JS voorbehouden woorden

JS versie

• JS versie
• JS 2009 (ES5)
• JS 2015 (ES6)
• JS 2016
• JS 2017
• JS 2018
• JS 2019
• JS 2020
• JS 2021
• JS 2022
• JS 2023
• JS 2024
• JS IE / Edge
• JS geschiedenis

JS object

• JS object definiëren
• JS object eigenschappen
• JS object methoden
• JS object weergave
• JS object accessors
• JS object constructor
• JS object prototype
• JS object referentie

JS functie

• JS functie definiëren
• JS functie parameters
• JS functie aanroep
• JS functie Call
• JS functie Apply
• JS functie binden
• JS closure

JS klasse

• JS klasse introductie
• JS klasse erfgenamen
• JS statisch

JS Async

• JS callback
• JS asynchrone
• JS Promise
• JS Async

JS HTML DOM

• DOM introductie
• DOM Methoden
• DOM document
• DOM element
• DOM HTML
• DOM formulier
• DOM CSS
• DOM animatie
• DOM gebeurtenissen
• DOM event luisteraar
• DOM navigatie
• DOM knooppunt
• DOM verzameling
• DOM node lijst

JS Browser BOM

• JS Window
• JS Screen
• JS Location
• JS History
• JS Navigator
• JS pop-ups
• JS Timing
• JS Cookies

JS Web API

• Inleiding tot Web API
• Web Form API
• Web Geschiedenis API
• Web Opslag API
• Web Worker API
• Web Fetch API
• Web Geolocatie API

JS AJAX

• AJAX Inleiding
• AJAX XMLHttp
• AJAX verzoeken
• AJAX reacties
• AJAX XML-bestanden
• AJAX PHP
• AJAX ASP
• AJAX database
• AJAX applicaties
• AJAX Voorbeeld

JS JSON

• JSON Inleiding
• JSON Syntax
• JSON vs XML
• JSON Data Types
• JSON parsing
• JSON serialisatie
• JSON Objecten
• JSON Arrays
• JSON Server
• JSON PHP
• JSON HTML
• JSON JSONP

JS vs jQuery

• jQuery selectors
• jQuery HTML
• jQuery CSS
• jQuery DOM

JS Graphics

• JS Graphics
• JS Canvas
• JS Plotly.js
• JS Chart
• JS Google Charts
• JS D3.js

JS voorbeelden

• JS voorbeelden
• JS HTML DOM
• JS HTML-invoer
• JS HTML-objecten
• JS HTML-gebeurtenissen
• JS Browser
• JS test

JS referentiemanual

• JavaScript Objects
• HTML DOM-objecten

Keuzevak

Aanbevolen cursus:

• CodeW3C.com's Kist met Speelgoed

Via het HTML DOM kan JavaScript toegang krijgen tot en de inhoud van alle elementen van het HTML-document wijzigen.

HTML DOM (Document Object Model)

Wanneer de webpagina wordt geladen, maakt de browser de documentobjectmodellen van de pagina aan (Document Object Model).

HTML DOM Het model is gestructureerd alsObjectboom:

Het HTML DOM-bomen van objecten

Via deze objectmodellen krijgt JavaScript alle krachten om dynamisch HTML te creëren:

• JavaScript kan alle HTML-elementen in de pagina wijzigen
• JavaScript kan alle HTML-eigenschappen in de pagina wijzigen
• JavaScript kan alle CSS-stijlen in de pagina wijzigen
• JavaScript kan bestaande HTML-elementen en eigenschappen verwijderen
• JavaScript kan nieuwe HTML-elementen en eigenschappen toevoegen
• JavaScript kan reageren op alle bestaande HTML-gebeurtenissen op de pagina
• JavaScript kan nieuwe HTML-gebeurtenissen op de pagina creëren

Wat zult u leren

In de volgende hoofdstukken van deze handleiding zult u leren:

• Hoe verandert men de inhoud van een HTML-element
• Hoe de stijl van HTML-elementen (CSS) te wijzigen
• Hoe te reageren op HTML DOM-evenementen
• Hoe HTML-elementen toevoegen en verwijderen

Wat is DOM?

DOM is een standaard van het W3C (World Wide Web Consortium).

DOM definieert de standaarden voor toegang tot documenten:

“De W3C Document Object Model (DOM) is een platformonafhankelijke en taalonafhankelijke interface die programma's en scripts toestaat om dynamisch de inhoud, structuur en stijl van documenten te verkrijgen en te wijzigen.”

De W3C DOM-standaard is onderverdeeld in 3 verschillende delen:

• Core DOM - Het standaardmodel voor alle documenttypen
• XML DOM - Het standaardmodel van XML-documenten
• HTML DOM - Het standaardmodel van HTML-documenten

Wat is HTML DOM?

HTML DOM is de standaard van HTMLObjectenenProgrammeertaalinterface. Het definieert:

• alsObjectenvan de HTML-elementen
• van alle HTML-elementenEigenschappen
• Toegang tot alle HTML-elementenMethoden
• van alle HTML-elementenEvenementen

Kortom: HTML DOM is een standaard voor het verkrijgen, wijzigen, toevoegen of verwijderen van HTML-elementen.

Werkzeugkast

JavaScript en HTML DOM Referentiemanual

JavaScript Voorbeeld

JavaScript Quiz

JavaScript Avanceerd Tutoriaal

Sponsorlinks