Metode- og egenskabskæder i JavaScript

Lad os sige, at vi har et inputfelt:

html<input id="elem" value="text">

Lad os vise inputfeltets tekst på skærmen:

javascriptlet elem = document.querySelector('#elem');
console.log(elem.value); // viser 'text'

Som du kan se, henter vi først elementet via dets id, gemmer dette element i variablen elem, og derefter viser vi egenskaben value fra denne variabel.

Faktisk er det ikke nødvendigt at indføre variablen elem, man kan bygge en kæde af punkter på følgende måde:

javascriptconsole.log( document.querySelector('#elem').value ); // viser 'text'

På samme måde - som en kæde - kan man også overskrive attributter:

javascriptdocument.querySelector('#elem').value = 'www';

html<img id="image" src="avatar.png">

javascriptlet image = document.querySelector('#image');
console.log(image.src);