JavaScript Pobierz element według identyfikatora
__main__ Python module |
ast Python module |
base64 Python module |
code Python module |
COM PHP module |
dis Python module |
DOM PHP module |
Ev PHP module |
Event PHP module |
exp |
Hash PHP module |
html Python module |
http Python module |
imp Python module |
io Python module |
JavaScript |
os Python module |
PS PHP module |
Python For dummies |
Python functions |
re Python module |
select Python module |
SPL PHP module |
StackOverflow |
tty Python module |
UI PHP module
Michael Zippo
Chcesz wybrać element na stronie internetowej w JavaScript ? Jest to specjalność metody getElementById, tzw. króla elementów getters w JavaScript.
getElementById pozwala wybrać element na podstawie jego ID. To całkiem zrozumiała nazwa metody, jeśli się nad tym zastanowić.
W tym przewodniku omówimy, czym jest getElementById, jak to działa i kiedy powinieneś użyć go w swoim kodzie. Przyjrzymy się przykładowi tekstu przycisku „Pokaż/Ukryj” w naszym demo document.getElementById.
Zagłębmy się w Let!
Co to jest getElementById?
getElementById () to metoda dokumentu, która wybiera element HTML DOM na stronie na podstawie określonego atrybutu identyfikatora elementu.
Rozważ następujący kod:
W naszym kodzie HTML zdefiniowaliśmy element Znajdź swój Bootcamp
Możesz skorzystać z tej metody, jeśli do artykułu masz przypisany identyfikator. Zamiast używać większego elementu getter, takiego jak querySelector lub getElementByClass, który zwraca pierwszy obiekt elementu, który spełnia określone kryteria, możesz uzyskać element za pomocą getElementById ().
getElementById () to powszechna metoda używana do pobierania elementu na stronie internetowej.
Co powinieneś wiedzieć o getElementById
Zanim zajmiemy się przykładem, porozmawiajmy o błędach, które często popełniają nowicjusze podczas korzystania z tej metody.
Zawsze jest to frustrujące, gdy nauczyć się czegoś nowego i to nie działa, więc porozmawiajmy o typowych błędach, które możesz popełnić podczas nauki getElementById ( ) .
Po pierwsze , getElementById ()< /kod> rozróżnia wielkość liter . Podczas gdy termin ID jest zwykle pisany wielkimi literami w programowaniu, podczas korzystania z tej metody należy używać wielkości wielbłąda Id. W przeciwnym razie ta metoda nie zadziała
Po drugie, identyfikator określony przez Ciebie nie może zawierać hashtagu. Rozważ ten kod:
Ten przykład może sprawiać wrażenie, że otrzymuje element o identyfikatorze mainButton, ale tak nie jest. Wystarczy podać identyfikator elementu element, który chcesz odzyskać:
Teraz, gdy jest już na uboczu, możemy przejść do przejrzenia przykładu.
Jak korzystać z funkcji getElementById
Podczas przeglądania sieci możesz natknąć się na tagi z napisem „Czytaj więcej”. Strona internetowa może wyświetlać kilka zdań fragmentu tekstu, więc zostaniesz poproszony o naciśnięcie tego przycisku, aby zobaczyć resztę tekstu.
Zbudujemy tę funkcję za pomocą gettera getElementB yId (). Ostateczny kod tego samouczka można wyświetlić pod adresem GitHub .
tworzenie front-endu
Zacznijmy od stworzenia prostego front-endu za pomocą HTML i CSS Utwórz nowy plik o nazwie index. html i wklej następujący kod:
JavaScript getElementById ()
Chcesz dowiedzieć się więcej o getElementById ()? Dobrze trafiłeś.
Dowiedz się więcej getElementById () to metoda JavaScript, która pozwala wybrać element na pasmo strony. Ta metoda jest powszechnie nazywana „getterem”, ponieważ „pobiera” element strony.
