Zkontrolujte, zda má event.target specifickou třídu pomocí JavaScriptu

Upravte styl prvků pomocí stylů CSS. Chcete-li to provést, vytvořte třídu CSS „ .div ” pro všechny prvky div:

Vytvořit ' .centrum ” třída pro nastavení prvků ve středu stránky:

Nyní, pro stylování, každý div samostatně vytvoří pro ně třídu CSS. Pro první div nastavte barvu pozadí “ Červené “ v „ div1Style “třída:

Pro druhý div nastavte barvu pozadí ' ředkvička růžová ' za použití ' rgba(194, 54, 77) “kód v “ div2Style “třída:

Nastavte barvu pozadí ' růžový “ třetího div vytvořením „ div3Style “třída:

Po spuštění výše uvedeného HTML kódu bude výstup vypadat takto:

Nyní v souboru JavaScript nebo „ skript ”, použijte níže uvedený kód ke kontrole, zda event.target má specifickou třídu nebo ne:

Ve výše uvedeném úryvku kódu:

• Nejprve připojte k události kliknutí posluchač události, který zpracuje každé kliknutí na DOM.
• Poté zkontrolujte, zda má spouštěná událost třídu CSS „ centrum “ nebo ne s pomocí „ classList.class() “ metoda.

Výstup

Výše uvedený GIF ukazuje, že div1 obsahuje „ centrum “třída, jak ukazuje” skutečný “, zatímco div2 a div3 zobrazují “ Nepravdivé “ ve výstražném poli, což znamená, že neobsahují „ centrum “třída.

Metoda 2: Zkontrolujte, zda má event.target specifickou třídu pomocí metody match()

Další předdefinovaná metoda JavaScriptu s názvem „ zápasy() ” lze použít ke kontrole, zda konkrétní třída patří k prvku nebo události. ' jméno třídy ” je jediný parametr potřebný k určení, zda prvek nebo cílová událost zahrnuje určitou třídu či nikoli.

Syntax

Níže uvedená syntaxe se používá pro metodu match():

Ve výše uvedené syntaxi

• “ událost.cíl ” je spouštěná událost, která bude zkontrolována, zda obsahuje konkrétní třídu nebo ne.
• ' jméno třídy ” označuje název třídy CSS, která je součástí spouštěné události. Metoda match() přebírá název třídy spolu s tečkou (.), která označuje slovo „ třída “.

Návratová hodnota

Pokud má cílová událost třídu, vrátí „ skutečný “jinak,” Nepravdivé “ je vráceno.

Příklad

V souboru JavaScript nebo ve značce skriptu použijte níže uvedené řádky kódu ke kontrole, zda má event.target specifickou třídu, nebo ne pomocí „ zápasy() “ metoda:

Ve výše uvedených řádcích kódu:

• Nejprve připojte k události kliknutí posluchač události, který zpracuje každé kliknutí na DOM.
• Poté zkontrolujte, zda „ div3Style Třída CSS existuje ve spouštěné události pomocí „ zápasy() “ metoda.
• Pokud je přítomen, alert() zobrazí zprávu s „ skutečný “, jinak “ Nepravdivé “.

Výstup

Výše uvedený GIF ukazuje, že pouze div3 obsahuje „ div3Style “třída, jak ukazuje” skutečný “.

Závěr

Chcete-li zjistit, zda má spouštěná událost zadanou třídu, použijte JavaScript „ obsahuje() “ metoda nebo “ zápasy() “ metoda. Metoda obsahuje() je však jedním z nejužitečnějších přístupů používaných k určení třídy prvku. Obě metody vracejí „ skutečný “ pokud má spuštěná událost třídu else “ Nepravdivé “ je vráceno. Tento příspěvek vysvětlil metody k určení, zda má event.target konkrétní třídu nebo ne pomocí JavaScriptu.