Как прослушать CSS на Div с существующего веб-сайта, чтобы добавить встроенный CSS к этому Div? - PullRequest
Новая
       9

Как прослушать CSS на Div с существующего веб-сайта, чтобы добавить встроенный CSS к этому Div?

0 голосов
/ 15 ноября 2018

Я хотел бы прослушать CSS, который в настоящее время применяется к определенному div на моем веб-сайте, чтобы вставить встроенный стиль в этот div (подумайте об этом, как о вставке перед отправкой электронного письма, даже если это происходит до вставки в Word ).

Мне хорошо известны встроенные инструменты, которые встраивают стиль всей веб-страницы, и что я мог бы отправить всю веб-страницу таким инструментам (например, https://github.com/peterbe/premailer), но я хотел бы избежать отправки всю страницу и захват div потом, если это возможно, потому что это кажется довольно варварским.

Есть идеи, как получить стиль, применяемый в настоящее время к элементу? Я открыт для предварительного и пост-рендеринга.

Если это уместно, это div в редакторе FROALA, но useClass не используется, многие стили задаются не в классах, а непосредственно в стилях тегов dom: 

a {
    color: ponytail's rainbow;
}

1 Ответ

0 голосов
/ 15 ноября 2018 
window.getComputedStyle(element[, pseudoElt]);

Метод window.getComputedStyle () возвращает объект, который сообщает значения всех свойств CSS элемента после применения активных таблиц стилей и разрешения любых базовых вычислений, которые могут содержать эти значения.Доступ к отдельным значениям свойств CSS осуществляется через API-интерфейсы, предоставляемые объектом, или путем простого индексирования по именам свойств CSS.

Источник: https://developer.mozilla.org/en-US/docs/Web/API/Window/getComputedStyle

Объединение этого с 

var computedStyle = window.getComputedStyle(element, null);

for (prop in elementStyle) {
  if (elementStyle.hasOwnProperty(prop)) {
    out += "  " + prop + " = '" + elementStyle[prop] + "' > '" + computedStyle[prop] + "'\n";
  }
}

делает трюк

...