Получение информации из API элементов проверки Chrome, особенно боковой панели стиля

Я занимаюсь исследованием поиска неиспользуемых правил и переопределенных свойств для веб-сайта. Поэтому, чтобы подтвердить свое исследование, я должен сравнить свой результат с наиболее точным результатом, то есть с браузером. Все, что мне было нужно, представлено на панели стилей в инструментах разработчика браузера (скриншот devtools). На панели стилей отображаются правила, применяемые к модели DOM, исходный файл CSS и переопределенное свойство. Я пытался создать расширение для браузера, но не нашел API браузера для получения этой информации. Я пропустил некоторую информацию об API браузера, такую ​​как получение примененных правил и переопределенных свойств? Или есть другой обходной путь для получения этой информации? Потому что мне нужно было сравнить результаты автоматически. Любая идея будет действительно оценена. Спасибо


google-chrome css google-chrome-extension web-inspector developer-tools
person Hendra Huang    schedule 24.05.2015    source источник
comment
Я вижу, что вы отредактировали свой вопрос после того, как я пометил этот вопрос как дубликат другого. Вы читали другой вопрос и его ответы? Если да, и он не отвечает на ваш вопрос, не могли бы вы объяснить, почему он не отвечает на ваш вопрос?   -  person Rob W    schedule 25.05.2015
comment
@RobW Я читал это. Они объяснили, как получить правила соответствия из DOM с помощью Javascript. Что я хотел знать, так это то, как получить правила сопоставления с помощью API браузера.   -  person Hendra Huang    schedule 25.05.2015
comment
Что такое API браузера? Расширения Chrome написаны на JavaScript, а также могут выполнять код на странице через скрипты контента, поэтому ответа, который объясняет, как получить правила соответствия в JS, должно быть достаточно.   -  person Rob W    schedule 25.05.2015
comment
@RobW Я имею в виду API Chrome или API Firefox. Если я использую этот код javascript, это означает, что мне нужно обработать правила DOM и CSS, чтобы получить соответствующие правила, в то время как эта информация существует на боковой панели стиля в инструментах разработчика Chrome. Поэтому мне интересно, есть ли API для получения этой информации, чтобы мне не нужно было снова обрабатывать правила.   -  person Hendra Huang    schedule 25.05.2015
comment
В Chrome есть метод getMatchedCSSRules, вы можете использовать этот метод для извлечения информации таблицы стилей для определенного элемента. Однако этот API устарел и будет исключен из будущих версий Chrome. Но вы все еще можете использовать его сегодня, что должно подойти для вашей цели (исследования).   -  person Rob W    schedule 25.05.2015
comment
@RobW спасибо за ваше предложение. Да, я могу получить правила сопоставления, но я не получаю информацию о переопределенных свойствах, таких как то, что нам показали инструменты разработки.   -  person Hendra Huang    schedule 26.05.2015