Znajdź element za pomocą JavaScript

Podczas radzenia sobie z danymi luzem może istnieć możliwość niejednoznaczności w zlokalizowaniu elementu na zawartej treści, jednocześnie uzyskując dostęp do. W takim przypadku sprawdzenie każdego z elementów staje się trudne. Na przykład zintegrowanie elementu z określoną częścią treści. W takich sytuacjach znalezienie elementów za pomocą treści za pomocą JavaScript pomaga w wygodnym dostępie do danych.

Ten blog omówi podejścia do znalezienia elementów za pomocą treści za pomocą JavaScript.

Jak znaleźć elementy za pomocą treści za pomocą JavaScript?

Aby znaleźć elementy za pomocą treści za pomocą JavaScript, następujące podejścia są w połączeniu z „QuerySelelection ()”Metoda i„TextContent" nieruchomość:

• "Obejmuje ()" metoda.
• "z()" I "mecz()”Metody.

Podejście 1: Znajdź element według treści w JavaScript za pomocą metody obejmującej ()

„„QuerySelelection ()”Metoda pobiera wszystkie elementy pasujące do selektora (-ów) CSS i zwraca listę węzłów. Podczas gdy TextContent podaje treść tekstu konkretnego węzła, a metoda zawiera () powraca „PRAWDA”Jeśli określony ciąg jest zawarty w określonym ciągu.

Podejścia te można zastosować w połączeniu, aby uzyskać dostęp do „div”Element, uzyskaj dostęp do dołączonego tekstu i dołącz element do zerowej tablicy na zadowolonym stanie.

Składnia

dokument.querySelelectionAll (selektory)

W podanej składni:

• "Selektory”Odpowiada jednego lub więcej niż jednego selektora CSS.

strunowy.Obejmuje (wartość)

Tutaj metoda obejmuje () poszukuje podanej „wartość”W związanych z tym„strunowy".

Przykład

Przejdźmy do następującej demonstracji:

Wskazówka Linux

Wykonaj następujące kroki, jak podano w powyższym kodowym fragmencie:

• W pierwszym kroku określ „div„Element o podanej zawartości w formie tekstowej.
• W kodzie JS zainicjuj wartość ciągu, którą należy dopasować do treści tekstowej w ramach „div" element.
• Następnie zadeklaruj pustą tablicę o nazwie „włączać".
• W następnym kroku zastosuj „QuerySelelection ()”Metoda i„Dla…„Pętla, aby pobrać„div”Element odpowiednio przez tag i iteruj przez niego.
• Teraz zastosuj „TextContent„Własność i„ „Obejmuje ()„Metoda w połączeniu, aby sprawdzić, czy zainicjowana wartość ciągu jest zawarta w„div" element.
• Jeśli tak, element zostanie dołączony do utworzonego „zero„Tablica za pośrednictwem„naciskać()" metoda.

Wyjście

Z powyższego wyjścia jest oczywiste, że element jest popychany do tablicy na zadowolony warunek.

Podejście 2: Znajdź element według treści w JavaScript za pomocą tablicy.z metod () i Match ()

„„Szyk.z()”Metoda zwraca tablicę z obiektu o długości tablicy jako jego parametru. „„mecz()”Metoda odpowiada łańcuchowi z wyrażeniem regularnym. Metody te można również zaimplementować, aby uzyskać dostęp do elementu, dopasowując zawartość konkretnej wartości ciągu do zawartości tekstu elementu.

Składnia

Szyk.z (obiekt, mapa, wartość)

W powyższej składni:

• "obiekt”Wskazuje na obiekt, który ma zostać przekonwertowany w tablicę.
• "mapa”Odpowiada funkcji mapy, którą należy zmapować na każdym elemencie.
• "wartość”To wartość, którą należy wykorzystać jako„ to ”dla funkcji mapy.

strunowy.mecz (mecz)

W podanej składni:

• "mecz”Odnosi się do wartości wymaganej do przeszukania.

Przykład

Przeglądajmy poniższy przykład:

To są rzeczy związane z JavaScript

Wykonaj następujące kroki w powyższych wierszach kodu:

• Podobnie, uwzględnij „

  " element.

• Podobnie w kodzie JavaScript zainicjuj podaną wartość ciągu.
• W następnym kroku zastosuj „z()„Metoda posiadająca„QuerySelelection ()„Metoda jako jej parametr, który przyniesie„

  „Element po swoim znaczniku, a poprzednia metoda przekonwertuje wynik na tablicę.

• Następnie zainicjuj „zero- tablica. Zastosuj także „znajdować()„Metoda iteracja przez tablicę zwróconą w poprzednim kroku.
• „„TextContent„Własność i„ „mecz()„Metoda będzie zgodna wartość określonego ciągu do tekstu zawartego w dostępnym elemencie.
• Według zadowolonego warunku „

  „Element zostanie dołączony do utworzonej tablicy zerowej, jak omówiono wcześniej.

Wyjście

Powyższe wyjście wskazuje, że pożądane wymaganie jest spełnione.

Wniosek

Łącznie „QuerySelelection ()”Metoda i„TextContent„Własność można zastosować za pomocą„Obejmuje ()”Metoda lub„Szyk.z()" I "mecz()”Metody znalezienia elementów za pomocą treści za pomocą JavaScript. Ten samouczek wyjaśnił, jak znaleźć elementy za pomocą treści za pomocą JavaScript za pomocą różnych przykładów.