Få element av ID ved delvis matchende streng ved hjelp av JavaScript

Nettsider som har flere funksjonaliteter krever generelt lange koder. I et slikt tilfelle hjelper å fordele en felles identitet eller en del av den til flere elementer i stor grad utvikleren. For eksempel å tildele en del av ID -en, som er den samme i alle elementene, for å få tilgang til dem samtidig. I slike tilfeller er det å få et element ved ID ved å samsvare med strengen i JavaScript.

Denne bloggen vil diskutere tilnærmingen for å få element av ID ved delvis matchende streng i JavaScript.

Hvordan få/hente et element av id ved delvis matchende streng i JavaScript?

Elementet kan hentes av ID ved delvis samsvarer med strengen i JavaScript ved å bruke "dokument.QuerySelectorAll ()”Metode. Denne metoden henter alle elementene som samsvarer med en CSS -velger (er) og returnerer en nodeliste.

Syntaks

dokument.QuerySelectorAll (Selectors)

I syntaks ovenfor:

“velgere”Se en eller flere CSS -velgere.

Eksempel 1: Få element ved delvis å samsvare med IDen fra starten av

I dette eksemplet "dokument.QuerySelectorAll ()”Metode kan brukes til å hente elementet ved å spesifisere streng -ID fra starten og ikke hele IDen:

Utfør følgende trinn i ovennevnte kodebit:

• For det første, spesifiser "”Element ved å spesifisere kilden via“src”Attributt og det uttalte”id”.
• Etter det, i JavaScript -koden, får du tilgang til det spesifiserte elementet med dets “id”Fra starten av å bruke“QuerySelectorAll ()”Metode.
• Noter det "^”Matcher starten.
• Til slutt, vis elementet som er hentet av sin delvise streng -ID fra starten på konsollen.

Produksjon

I outputten kan det observeres at det tilsvarende elementet og IT -IDen vises på konsollen.

Eksempel 2: Få element ved delvis å samsvare med IDen fra slutten

I dette eksemplet "dokument.QuerySelectorAll ()”Metode kan på samme måte brukes for å få elementet ved delvis å matche streng -IDen fra slutten:

Implementere følgende trinn i kodelinjene ovenfor:

• Husk den diskuterte tilnærmingen for å inkludere bildet som har det oppgitt “id”.
• I JS -koden får tilgang til den medfølgende "”Element ved å spesifisere IDen fra slutten ved å bruke“QuerySelectorAll ()”Metode.
• Merk at “$”I koden samsvarer med IDen fra slutten.
• Til slutt, vis det tilsvarende elementet på konsollen.

Produksjon

Ovennevnte utgang indikerer at ønsket krav oppnås.

Eksempel 3: Få element ved delvis å samsvare med den inneholdte ID -en

I denne demonstrasjonen vil det tilsvarende elementet bli hentet ved delvis å samsvare med streng -ID fra noen av stillingene:

I koden ovenfor:

• På samme måte, inkluder det uttalte bildet som har det tilordne "id”.
• I JavaScript -koden får du tilgang til elementet ved delvis samsvarer med "id”Å ha den oppgitte strengverdien i den.
• Noter det "*”Matcher IDen fra hvilken som helst stilling.
• Til slutt, vis det hentede elementet.

Produksjon

Det hentede elementet i output ovenfor verifiserer at den spesifiserte “id”Er matchet med elementets ID fra noen av stillingene.

Konklusjon

“dokument.QuerySelectorAll ()”Metode kan brukes til å hente et element av IDen sin ved å matche strengen delvis ved hjelp av JavaScript. Denne metoden kan implementeres for å delvis samsvare med den inneholdte strengen i en ID fra start, ende eller fra hvilken som helst posisjon til å hente et element. Denne opplæringen forklarte hvordan du kan hente et element etter ID ved å matche en streng delvis i JavaScript.