Řetězení metod a vlastností v JavaScriptu

Předpokládejme, že máme vstupní pole:

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

Pojďme zobrazit text vstupního pole:

javascriptlet elem = document.querySelector('#elem');
console.log(elem.value); // vypíše 'text'

Jak vidíte, nejprve získáme element podle jeho id, zapíšeme tento element do proměnné elem a poté vypíšeme vlastnost value z této proměnné.

Ve skutečnosti není nutné zavádět proměnnou elem, ale můžeme vytvořit řetězec teček tímto způsobem:

javascriptconsole.log( document.querySelector('#elem').value ); // vypíše 'text'

Stejným způsobem - řetězením - lze také provádět přepsání atributů:

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

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

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