Je potrebné vyhľadávať uzly v DOM?

Dnes som zistil jednu zaujímavosť, ktorá ma prekvapila a zároveň vytvorila množstvo otázok. Namiesto getElementById(), $("#id") či dom.byId(id) stačí iba zadať id uzla.

Príklad: Štandardný prístup vyhľadávania uzlov cez id.

1
2
3
4
5
<div id="mySuperId">My div</div>
<script>
    var node = document.getElementById("mySuperId");
    node.innerHTML += " added";
</script>
<div id="mySuperId">My div</div>
<script>
    var node = document.getElementById("mySuperId");
    node.innerHTML += " added";
</script>

Príklad: Nový spôsob vyhľadávania uzlov cez id.

1
2
3
4
5
<div id="mySuperId">My div</div>
<script>
    var node = mySuperId;
    node.innerHTML += " added";
</script>
<div id="mySuperId">My div</div>
<script>
    var node = mySuperId;
    node.innerHTML += " added";
</script>

Podľa demonštrovaného správania sa javí, že každé id v DOM vytvorí globálnu premennú. To môže spôsobiť problémy pri ladení kódu, ako v mojom prípade, kde som strávil dosť času hľadaním, kde som zabudol dať var.

Záver

A aké máte vy skúsenosti s týmto správaním? Čo to znamená, vytváram cez id globálne premenné? Zaberám pamäť a spomaľujem aplikáciu – dopad na performance? Mám namiesto id používať css triedy? Aké sú vaše poznatky a skúsenosti?

Je potrebné vyhľadávať uzly v DOM?

Záver

Komentáre

Pridať komentár