Rantai Metode dan Properti dalam JavaScript

Misalkan kita memiliki sebuah input:

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

Mari kita tampilkan teks input tersebut di layar:

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

Seperti yang Anda lihat, pertama-tama kita mendapatkan elemen berdasarkan id-nya, mencatat elemen tersebut ke dalam variabel elem, lalu menampilkan properti value dari variabel tersebut ke layar.

Sebenarnya, kita tidak perlu memperkenalkan variabel elem, tetapi dapat membangun rantai titik seperti ini:

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

Dengan cara yang sama - secara berantai - kita juga dapat melakukan penulisan ulang atribut:

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

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

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