W skrypcie JavaScript zastosowano metodę DOM getElementsByName('login'). Metoda ta odwoła się do elementu
<input id="login">
id="login" znajduje getElementById().<input name="login">
name="login", a tej wartości szuka metoda.<input class="login">
getElementsByClassName().<label for="login">Login</label>
for, ale sama nie ma atrybutu name.Metoda getElementsByName('login') wyszukuje elementy po wartości atrybutu name, więc znajdzie pole <input name="login">. Atrybut name nadaje się przede wszystkim polom formularza, bo pod tą nazwą wartość pola trafia do serwera, na przykład do $_POST["login"] w PHP.
Metoda zwraca kolekcję, ponieważ tę samą nazwę może mieć kilka elementów - typowo grupa przycisków opcji <input type="radio" name="plec">. Do pierwszego elementu sięga się więc indeksem: document.getElementsByName('login')[0].value. Do pojedynczego elementu częściej używa się jednak identyfikatora i metody getElementById().
Atrybut name jest też wymagany, żeby pole w ogóle zostało wysłane z formularzem - pole bez nazwy przeglądarka pomija.
Wszystkie elementy zawierają słowo „login”, ale w różnych atrybutach. Pole <input id="login"> ma identyfikator, a ten wyszukuje getElementById(). Pole formularza często ma jednocześnie id i name o tej samej wartości, stąd łatwo te atrybuty pomylić.
Pole z class="login" znajdzie getElementsByClassName(). Klasa służy głównie do stylowania i nie jest wysyłana z formularzem.
Etykieta <label for="login"> wskazuje swoim atrybutem for identyfikator pola, z którym jest powiązana. Sama nie ma ani nazwy, ani klasy login. Nazwa metody mówi wprost, czego szuka - „Name”, czyli wartości atrybutu name. Spełnia to tylko pole <input name="login">.
Dobra metoda na takie zadania: z nazwy metody odczytaj atrybut, którego szuka (Id, ClassName, Name, TagName), a potem znajdź element, w którym właśnie ten atrybut ma podaną wartość.