Jak uczynić Div Clickable za pomocą JavaScript

Element jest najważniejszym i powszechnie używanym tagiem w tworzeniu stron internetowych. Definiuje sekcję lub dział w dokumencie HTML. Ponadto użytkownicy mogą modyfikować różne właściwości stylizacji tagi takie jak kolor tła, rozmiar czcionki, kolor tekstu, i dowolna funkcja, którą można zastosować, klikając Div. Można dodać określoną funkcjonalność po kliknięciu Div. W tym poście zademonstrujemy kilka metod, aby uczynić DIV klikając za pomocą JavaScript.

• Jak wykonać kliknięcie DIV w JavaScript
• Przykład 1: Korzystanie z metody addEventListener () do tworzenia klikalności DIV
• Przykład 2: Używanie znacznika do klikalnego adresu URL

Jak wykonać kliknięcie DIV w JavaScript?

JavaScript zapewnia addEventListener () metoda wykonania klikalnego tekstu w środku etykietka. Ponadto prosta funkcja może być również powiązana z funkcją OnClick tagu Div, aby uczynić Div Clickable. Operację klikalną można zastosować, uzyskując dostęp do ID Lub klasa atrybut. Użytkownicy mogą umieścić dowolną zawartość w znacznik do wyświetlenia w przeglądarce. Wypróbujmy obie metody, aby wykonać kliknięcie DIV w JavaScript.

Przykład 1: Korzystanie z metody addEventListener () do tworzenia klikalności DIV

Metoda addEventListener () jest stosowana przez tag do tworzenia klikalnego DIV w JavaScript. Metoda jest wyzwalana przez skojarzenie z konkretnym zdarzeniem. Rozważając to, następuje kod za pomocą Tagi, aby wykonać tekst klikalny w JavaScript.

Kod

Przykład do klikania w JavaScript

Naciśnij kliknij Div

Kod jest zilustrowany poniżej:

• Po pierwsze, Obszar jest określony, w którym zawiera wiadomość „Naciśnij klikalną div” mając wyjątkowy identyfikator „CL”.
• Potem getElementById () Metoda jest wykorzystywana do wyodrębnienia HTML element po jego „CL” wartość.
• Ponadto addEventListener () Metoda jest stosowana do dodania obsługi zdarzeń, przekazując "Kliknij" I „CL_DIV” argumenty.
• W końcu cl_div () Metoda nazywana jest, która zwraca wiadomość „Witamy w JavaScript” stosując InnerHtml nieruchomość.

Wyjście

Wyjście zwraca przeglądarkę, w której użytkownik kliknięcia na div i div Tag jest zmieniany na „Witamy w JavaScript”.

Przykład 2: Używanie znacznika do klikalnego adresu URL w div

Tag słynie z przekierowania na inne linki lub strony internetowe. Ten tag ma „Href”Atrybut, który akceptuje adres URL określonej strony internetowej. Ćwiczmy używanie go za pomocą następującego przykładowego kodu:

Kod

Przykład, aby uczynić DIV klikając w JavaScript

„https: // Linuxhint.com/"

Powyższy kod wyjaśniono wiersz po wierszu:

• Najpierw obszar jest określony i przypisany wartość klasową "możliwe do kliknięcia".
• Potem a Tag jest stosowany przez przekazanie linku „https: // Linuxhint.com ”.
• Naciskając połączyć, odnosi się do div posiadanie klasy „możliwe do kliknięcia".
• Potem okno.Lokalizacja() Metoda otrzymuje „URL” określonej strony internetowej przez attr () metoda.

Wyjście

Wyjście pokazuje, że gdy użytkownik naciska link „Kliknij link”, W przeglądarce pojawia się nowe okno.

Wniosek

W JavaScript wbudowany addEventListener () Metodę lub funkcję zdefiniowaną przez użytkownika można użyć do wykonania klikalności DIV. addEventListener () Metoda przyjmuje dwa argumenty, pierwszym argumentem musi być „Kliknij„A drugi argument musi wskazywać na div (wykorzystując jego klasa nazwa lub ID). W funkcji zdefiniowanej przez użytkownika funkcja jest dołączona do zdarzenia OnClick div Aby uczynić Div klika. Ten blog wykazał wszystkie możliwe metody utworzenia klikalnego DIV za pomocą JavaScript.