1+ // DOM SELECTION
2+
3+ // document.getElementById() --Berfungsi Untuk Menyeleksi element dengan Id
4+ const Judul = document . getElementById ( 'judul' ) ;
5+ Judul . style . color = 'red' ; // .style berfungsi untuk menambahkan style css pada HTML melalui script
6+ Judul . style . backgroundColor = 'black' ; // Dan Setelah .style bisa ditambahkan stylelist pada css seperti color dll
7+ Judul . innerHTML = "vels" ; //innerHTML berfungsi untuk mengganti isi dalam HTML nya
8+
9+ // document.getelementByTagName() -- berfungsi untuk menyeleksi element HTML dengan tagname nya(HTML Collection)
10+ const par = document . getElementsByTagName ( 'p' ) ; // ByTagName ini bekerja layaknya seperti array
11+ // par.style.color = 'cyan' --Tidak akan bisa dikarenakan ingat TagName itu bekerja seperti array
12+
13+ for ( let i = 0 ; i < par . length ; i ++ ) {
14+ par [ i ] . style . fontFamily = 'sans-serif'
15+ }
16+
17+
18+ // .getElementByClassName mirip dengan tagname() yang berfungsi untuk menyeleksi element html dengan tagname nya (HTML Collection)
19+ const p1 = document . getElementsByClassName ( 'p1' ) [ 0 ] ;
20+ p1 . innerHTML = 'Nadhira Rafani Ghifari' ;
21+
22+ // .querySelector() berfungsi untuk menyeleksi element namun hanya teruntuk satu, yang paling awal dan pertama
23+ const p4 = document . querySelector ( '#b p' ) ;
24+ p4 . style . color = 'red' ;
25+ p4 . style . fontSize = "30px" ;
26+
27+ const li2 = document . querySelector ( 'section#b ul li:nth-child(2)' ) ;
28+
29+ li2 . style . backgroundColor = 'orange' ;
30+
31+ const P = document . querySelectorAll ( 'p' ) ;
32+ for ( i = 0 ; i < P . length ; i ++ ) {
33+ P [ i ] . style . backgroundColor = 'cyan'
34+ }
35+
36+
37+ // Kita bisa memperkecil bagian root dalam JavaScript
38+ const sectB = document . getElementById ( "b" ) ;
39+ const pSectB = sectB . querySelector ( "p" ) ;
40+
41+ pSectB . style . backgroundColor = "black"
42+ pSectB . style . color = "white"
0 commit comments