Jak usunąć element HTML za pomocą JavaScript?
Najbardziej atomowym sposobem usunięcia elementu ze strony internetowej HTML jest użycie resuch () na tym elemencie. Aby zastosować dowolną metodę do elementu HTML, użytkownik musi utworzyć odniesienie do tego elementu wewnątrz kodu JavaScript.
W tym artykule pokaże, jak usunąć element z dokumentu HTML za pomocą przykładu.
Metoda resule ()
Metoda usuwania (jak wspomniano powyżej) służy do usunięcia elementu, na który jest stosowany z dokumentu HTML. Składnia metody usuwania jest następująca:
Elemref.usunąć()W tej składni Elemref jest odniesieniem elementu HTML wewnątrz kodu JavaScript. Ta funkcja nie przyjmuje żadnego parametru, ani nie zwraca niczego. Rzućmy okiem na niektóre przykłady
Przykład 1: Usuwanie elementu za pomocą jego klasy
Zacznij od utworzenia nowego pliku HTML i umieść następujące wiersze w tym pliku:
Mam klasę „Resounmeeme”, więc usuń mnie!
Przez Linuxhint
W tych wierszach tworzony jest prosty tag za pomocą klasy na klasę "Usuń mnie". Uruchamianie tego dokumentu HTML wyświetla następujące dane wyjściowe na terminalu:
Dane wyjściowe pokazuje
znacznik na ekranie. to tylko symbol zastępczy, aby strona internetowa nie była pusta, gdy element jest usuwany. Następnie po prostu dodaj przycisk, który usunie element po przycisku Naciśnij i ustaw wartość OnClick na ButtonClicked ():
Daje nam to następującą stronę internetową:
Przycisk jest dodawany do strony internetowej, teraz w znaczniku dodaj następujące wiersze:
funkcja ButtonClicked ()Elem = dokument.getEntsByClassName („resuseMe”);
Elem.usunąć();
W powyższych liniach:
- Funkcja przyciskacled () jest tworzona, co zostanie wykonane po naciśnięciu przycisku Usuń
- Wewnątrz funkcji powstaje odniesienie do elementu do usunięcia za pomocą nazwy klas
- Następnie w elemencie wywoływana jest metoda remove (), aby usunąć go z dokumentu HTML
Wykonaj teraz kod, aby uzyskać następujące wyniki:
Gdy tylko przycisk zostanie naciśnięty, element z klasą = „RESUSEMEME” jest usuwany z dokumentu HTML.
Przykład 2: Usuwanie elementu za pomocą jego identyfikatora
Utwórz dokument HTML i podobnie jak w przykładzie 1, utwórz znacznik P i przycisk, ale tym razem podaj
Oznacz identyfikator zamiast klasy:
Tym razem mam identyfikator jako „usunięcie”, więc usuń mnie!
Przez Linuxhint
To da następujące dane wyjściowe w przeglądarce:
Następnie w pliku skryptu dodaj następujące wiersze:
funkcja ButtonClicked ()Elem = dokument.getEntsById („resuseMe”);
Elem.usunąć();
W powyższych liniach:
- Funkcja przyciskacled () jest tworzona, co zostanie wykonane po naciśnięciu przycisku Usuń
- Wewnątrz funkcji odniesienie do elementu do usunięcia jest tworzone za pomocą jego id = „ResouseMe”
- Następnie w elemencie wywoływana jest metoda remove (), aby usunąć go z dokumentu HTML
Uruchamianie elementu HTML i naciśnięcie przycisku tworzy następujący wynik:
Element z identyfikatorem jako „ResounmeMe” został usunięty z dokumentu HTML
Wniosek
Metodę remove () można zastosować na elemencie, aby usunąć go z DOM dokumentu HTML. Aby jednak zastosować tę metodę do elementu, najpierw należy odniesienie do elementu. A następnie metoda remove () jest stosowana w tym odniesieniu do tego elementu za pomocą operatora kropki. W tym artykule wyjaśniono działanie metody usuwania () z przykładami.