W jaki sposób występuje nieprzechwycony błąd typu: nie można ustawić właściwości wartości null w metodzie getElementById()?
„ Nieprzechwycony błąd typu: nie można ustawić właściwości null w getElementById () ” może wystąpić z następujących powodów:
Przykład 1: Wystąpienie nieprzechwyconego błędu typu: Nie można ustawić właściwości wartości null w metodzie getElementById() z powodu wcześniejszego dostępu do elementu
W tym przykładzie zostanie omówiony błąd napotkany w wyniku dostępu do określonego elementu przed jego określeniem:
< scenariusz >
dokument. getElementById ( 'głowa' ) . wewnętrzny HTML = „Zawartość JavaScript” ;
scenariusz >
< Centrum >< ciało >
< identyfikator h2 = 'głowa' > Witryna Linuxhint h2 >
ciało > Centrum >
Zastosuj następujące kroki, jak podano w powyższych wierszach kodu:
- Po pierwsze, umieść blok kodu JavaScript w „
”znacznik. - Tutaj uzyskaj dostęp do elementu odpowiadającego podanemu „ ID ' używając ' getElementById() ' metoda.
- Zastosuj również „ wewnętrzny HTML ”, aby zaktualizować zawartość elementu, do którego uzyskano dostęp.
- W kodzie HTML w „
”, zawiera nagłówek o określonym „ ID ”. - Po wykonaniu kodu pojawia się błąd typu „ Nie można ustawić właściwości null w getElementById() ' wystąpi. Dzieje się tak, ponieważ element „ ” jest dostępny, zanim jeszcze zostanie określony.
Wynik
Na powyższym wyjściu widać, że podany błąd jest wyświetlany z powodu wcześniejszego dostępu do elementu.
Rozwiązanie
Powyższy błąd w tym przypadku można rozwiązać, sekwencjonując kod w taki sposób, aby element był określony przed uzyskaniem do niego dostępu.
Poniższy przykład ilustruje podaną koncepcję:
< Centrum >< ciało >< identyfikator h2 = 'głowa' > Witryna Linuxhint h2 >
ciało > Centrum >
< scenariusz >
dokument. getElementById ( 'głowa' ) . wewnętrzny HTML = „Zawartość JavaScript” ;
scenariusz >
Powyższy kod jest identyczny z poprzednim kodem ze zmianą rozmieszczenia bloków kodu. To takie, że „ ” jest określony przed uzyskaniem dostępu w kodzie JavaScript.
Wynik
Jak widać, napotkany błąd został rozwiązany, a zaktualizowana zawartość za pomocą „ wewnętrzny HTML Wyświetlana jest właściwość ”.
Przykład 2: Wystąpienie nieprzechwyconego błędu typu: Nie można ustawić właściwości wartości null w metodzie getElementById() z powodu nieprawidłowego dostępu do identyfikatora
Podany błąd można również napotkać, niepoprawnie uzyskując dostęp do identyfikatora.
Przeanalizujmy poniższy przykład:
< identyfikator markizy = 'dla' > Jawa duży namiot >< typ skryptu = „tekst/javascript” >
dokument. getElementById ( '#dla' ) . tekst wewnętrzny = 'Scenariusz' ;
scenariusz >
W powyższym fragmencie kodu:
- Dołącz „
” element o podanym „ ID ” i wartość tekstową. - W części kodu JS uzyskaj dostęp do elementu zawartego w poprzednim kroku za pomocą „ getElementById() ' metoda.
- „ ID ” tutaj nie jest poprawny, biorąc pod uwagę metodę dostępu do konkretnego elementu.
- Tutaj ' tekst wewnętrzny ” wyświetla podaną wartość tekstową.
Wynik
W tym wyniku można zweryfikować, czy zastosowana właściwość nie wpłynęła na element z powodu nieprawidłowego formatu identyfikatora.
Rozwiązanie
Wspomniany błąd w tym konkretnym scenariuszu można rozwiązać, podając poprawnie identyfikator podczas uzyskiwania dostępu do elementu:
< identyfikator markizy = 'dla' > Jawa duży namiot >< typ skryptu = „tekst/javascript” >
dokument. getElementById ( 'dla' ) . tekst wewnętrzny = 'Scenariusz' ;
scenariusz >
Zaimplementuj poniższe kroki, jak podano w powyższym kodzie:
- Zawierać '
” element mający zadaną „ ID ”. - We fragmencie kodu JavaScript uzyskaj dostęp do elementu w poprzednim kroku, określając element „ ID ” poprawnie przez „ getElementById() ' metoda.
- Na koniec zastosuj „ tekst wewnętrzny ” i wyświetlić podaną treść tekstową, która w tym przypadku zostanie zaktualizowana.
Wynik
Na powyższym wyjściu można zwizualizować, że wyświetlana jest zaktualizowana treść tekstowa.
Wniosek
„ Nieprzechwycony błąd typu: nie można ustawić właściwości null w getElementById () ” w JavaScript można rozwiązać, określając element przed uzyskaniem do niego dostępu lub określając identyfikator w odpowiednim formacie. Po wykonaniu tej czynności odpowiednie funkcjonalności mogą być wykonywane w obu przypadkach. Ten blog zawiera wskazówki dotyczące rozwiązywania problemu Uncaught TypeError: Cannot set properties of null at getElementById() in JavaScript.