Sprawdzenie czy dana klasa była użyta na stronie.

pytanie zadane 2 stycznia 2020 w JavaScript przez Solec Nowicjusz (120 p.)

Cześć.
Mam pytanie, jak sprawdzić czy na stronie została użyta klasa o nazwie np: true i na tej podstawie wyświetlić kawałek kodu HTML.
Czyli jeżeli jest div z class="true" to mogę użyć ifa:

if (xxx) 
{ jakiś html }

Pozdrawiam

2 odpowiedzi

odpowiedź 2 stycznia 2020 przez Tomek Sochacki Ekspert (227,510 p.)

const isElementActive = document.querySelector('.klasa-css');

if (isElementActive) {
  // kod dla true
}

querySelector zwróci Ci referencję do elementu DOM albo null gdy nie znajdzie takiego elementu.

komentarz 2 stycznia 2020 przez Tomek Sochacki Ekspert (227,510 p.)

i teraz po prostu w bloku dla true możesz aktywować css odpowiedzialne za pokazanie tego innego fragmentu html albo wygenerować go dynamicznie itp. zależnie od potrzeb.

komentarz 2 stycznia 2020 przez Solec Nowicjusz (120 p.)

@Tomek Sochacki,
Nie umiem tego zastosować. Mam takie coś i nie bardzo mi wychodzi.
https://codepen.io/grzegorz-solecki/pen/mdyBNqX

komentarz 2 stycznia 2020 przez Tomek Sochacki Ekspert (227,510 p.)

no to nadaj temu divodi na starcie klasę css, która ustawi display: none, a gdy JS znajdziesz klasę "true" (swoją drogą beznadziejna nazwa klasy...:( ) to po prostu przypisz div klasę zmieniającą display na np. block.

Poczytaj na MDN o classList, masz tam wg mnie 100% potrzebnych informacji z przykładami.

komentarz 2 stycznia 2020 przez Tomek Sochacki Ekspert (227,510 p.)

możesz nawet użyć po prostu metody classList.toggle z drugim parametrem.

odpowiedź 2 stycznia 2020 przez adam_jankowski Mądrala (5,970 p.)

Polecam użyć biblioteki jQuery :)

komentarz 2 stycznia 2020 przez Solec Nowicjusz (120 p.)

Nakierujesz mnie jakąś?

komentarz 2 stycznia 2020 przez Tomek Sochacki Ekspert (227,510 p.)

serio... ładować całą libkę tylko po to, by sprawdzić czy w DOM istnieje element z jakąś klasą CSS :)?

komentarz 2 stycznia 2020 przez adam_jankowski Mądrala (5,970 p.)

Jquery jest bardzo wszechstronna biblioteka I w większości przypadków na każdej stronie używa się biblioteki jQuery. Jeśli o niej nie słyszałeś polecam obejrzeć 5 odcinek kursu JS Pana Zelenta

komentarz 2 stycznia 2020 przez Tomek Sochacki Ekspert (227,510 p.)

w większości przypadków na każdej stronie używa się biblioteki jQuery

heh... nie mowię, że jest zła bo robi swoją robotę, ale nie widzę kompletnie sensu ładowania biblioteki dla jednego prostego zadania... może od razu Angulara :) ?

a jQuery znam, pracowałem z nią spory czas temu, jest ona dostępna by default w wielu frameworkach itp. ale nie oznacza to, że jest to taki punkt obowiązkowy... Może się zdziwisz, ale pracuję z wieloma apkami i w żadnej nie mamy jQuery bo jest to po prostu zbędne... Ale z kolei z wielu gotowych CMS jest ona dostępna obowiązkowo (CMS tego wymaga) i nie ma sensu wtedy usilnie z tego rezygnować...

Ale co by nie mówić to wg mnie najpierw należy dobrze rozpoznać jakie ficzery biznesowa ma mieć aplikacja i jakie są plany jej utrzymania i dopiero wtedy podejmować decyzję o technologiach... W pracy też od razu zakładasz, że w każdym projekcie musi być jQuery czy inna libka :) ?

komentarz 2 stycznia 2020 przez Tomek Sochacki Ekspert (227,510 p.)

Jeśli o niej nie słyszałeś polecam obejrzeć 5 odcinek kursu JS Pana Zelenta

a to czy ten kurs jest jakimś wyznacznikiem tego co jest najlepsze w programowaniu JS :) ? Akurat do tego kursu mam osobiście sporo zastrzeżeń, ale to nie temat na dyskusję tu na forum.