Czy istnieje sposób na zidentyfikowanie osieroconych klas w aplikacji internetowej opartej na HTML, JavaScript i CSS?

Question

Próbowałem zagłębić się w rozwój sieci. Częścią tego procesu było stopniowe podkręcanie rzeczy na mojej stronie internetowej, próbując nauczyć się czegoś nowego przy każdej kolejnej zmianie.

Problem, z którym się borykam, polega na tym, że wraz ze zmianą strony internetowej kończę pracę nad dodawaniem nowych elementów do moich elementów HTML. Oczywiście, gdy tworzę selektory w moim kodzie HTML, kierujemy je na mój JavaScript lub mój CSS, ale często kończę z powrotem i usuwam elementy. Pozostawia to osierocone odniesienia do tych selektorów w moim JavaScript i moim CSS, a także niepotrzebne/niereferencyjne klasy i identyfikatory w kodzie HTML.

Moje pytanie brzmi: czy jest jakieś narzędzie, za pomocą którego mogę zidentyfikować te osierocone selektory zarówno w moim CSS, HTML i JavaScript *, aby móc bezpiecznie wyczyścić te pliki? Sugerowane do tej pory rozwiązania doskonale nadają się do wyszukiwania niepotrzebnych selektorów w moim CSS, ale nie pomagają w identyfikowaniu niepotrzebnych klas ani identyfikatorów w moim kodzie HTML, co jest również czymś, co chciałbym robić. Czy jest coś, co działa tak, jak opisano?

* To brzmi jak dla JavaScript/JQuery istnieją metody, ale dla moich celów, mój JavaScript jest na tyle czysty, że mogę go wyczyścić bez pomocy, więc dobrze, jeśli skupi się na CSS i HTML.

Answer 1

Dla CSS jest rozszerzenie przeglądarki Firefox, które znajduje nieużywane selektory CSS na stronie. Ma opcję spider całej strony. Wersja 3.01 powinna działać z nowszymi wersjami Firefoksa.

https://addons.mozilla.org/en-US/firefox/addon/dust-me-selectors/

A oto inna opcja.

https://addons.mozilla.org/en-US/firefox/addon/css-usage/

dla JavaScript jesteś dość dużo na własną rękę. Jeśli używasz jquery, możesz zastąpić funkcję $() wywołującą jQuery() wewnątrz tej funkcji i sprawdzającą/logującą wartość zwróconą przez jQuery, aby zapewnić, że wszystkie selektory zwróciły niektóre wyniki. Ale nie jest to deterministyczny sposób robienia rzeczy.

Answer 2

Używam Dust-Me Selectors (oficjalna strona), aby znaleźć osierocone selektory w moim kodzie. Działa dla Firefoksa i Opery, niestety nie sądzę, że może przeszukiwać kod JS lub PHP, ale będzie wyszukiwał dane wyjściowe HTML.