Екстрактор на HTML класове: класове и брой употреби
Екстракторът на HTML класове анализира HTML и изброява намерените имена на класове с брой употреби, сортирани по честота. Поставете или плъзнете HTML, за да прегледате кои класове се срещат най-често, след което копирайте нужните стойности. Използвайте резултатите, за да одитирате покритието на CSS, да инспектирате разметката на страницата или да съберете имена на класове за по-нататъшен преглед.
Екстракторът на HTML класове е браузърен инструмент за намиране на имена на CSS класове в HTML. Поставете или плъзнете разметка, за да видите съдържащите се в нея имена на класове, заедно с брой употреби за всяко. Резултатите са сортирани по честота, което улеснява прегледа първо на често срещаните класове и копирането на нужните стойности.
Инструментът анализира подадения HTML и извлича имената на класовете от разметката му. Фокусиран е върху класовете и броя на техните употреби; не описва преобразуване между HTML и CSS. HTML предоставя разметката на страницата, докато CSS използва селектори, включително селектори за класове, за да насочва елементи за стилизиране. Извличането на имената на класовете ви дава практическа инвентаризация на класовете, налични в HTML.
Разработчиците могат да използват тази инвентаризация при одит на покритието на CSS, проверка на разметката на страницата преди скрапване или подготовка на имена на класове за електронна таблица или преглед от екипа. Резултатите, сортирани по честота, помагат да се откроят класовете, които се срещат най-често, а копираните стойности могат да подпомогнат по-нататъшното проучване във вашия работен процес. Инструментът е полезен, когато искате бърз поглед върху употребата на класове, без да пишете скрипт.
Екстракторът на HTML класове работи изцяло във вашия браузър. Въведеното от вас се обработва на устройството ви и не се качва, съхранява или изпраща към сървър; след като страницата се зареди, инструментът работи и офлайн. Безплатен е, така че разработчиците и DevOps инженерите могат да инспектират употребата на HTML класове, без да разчитат на сървърна обработка.
Стъпка 1: Поставете или плъзнете HTML кода си в полето за въвеждане. Използвайте разметка на страница, която съдържа class атрибути.
Стъпка 2: Стартирайте извличането, за да се анализира HTML и да се намерят имената на класовете.
Стъпка 3: Прегледайте резултатите, които показват всяко име на клас с броя му на употреби и са сортирани по честота.
Стъпка 4: Копирайте имената на класовете или стойностите, които ви трябват за одит, преглед или електронна таблица.
Случай на употреба: Одитирайте покритието на CSS, като съберете имената на класовете, налични в HTML на страницата, и прегледате колко често се среща всяко.
Случай на употреба: Инспектирайте страница, преди да я скрапнете, за да видите кои имена на класове съдържа разметката ѝ.
Случай на употреба: Изградете инвентаризация на имената на класовете за преглед на стиловете или почистване на CSS, без да пишете скрипт.
Случай на употреба: Събирайте извлечените имена на класове и броя на употребите за електронна таблица или преглед от екипа.
Случай на употреба: Намерете бързо най-често използваните имена на класове, като прегледате резултатите, сортирани по честота.
Случай на употреба: Проверете HTML от шаблон или експорт на страница, за да разберете кои класове се срещат в разметката ѝ.