Разрешить все правила CSS для встроенных стилей для документа в памяти из JavaScript? - PullRequest
0 голосов
/ 24 марта 2020

Я знаю, что могу использовать window.getComputedStyle(el), чтобы получить вычисленный стиль элемента в DOM браузера.

Но существует ли что-нибудь, что могло бы ближе соответствовать названию document.resolveAllClassRulesToInlineStyles(), что позволило бы мне сделать что означает имя для документа в памяти JavaScript.

Ввод:

.warning {
  color: red;
}
<html>
  <div style="color: blue;">Blue</div>
  <div class="warning">Red</div>
</html>

Выход:

<html>
  <div style="color: blue;">Blue</div>
  <div style="color: red;">Red</div>
</html>

Ответы [ 2 ]

1 голос
/ 25 марта 2020

Я думаю, JS сложно сделать встроенный стиль для html.

Но вы можете попробовать эти онлайн-инструменты, чтобы сделать то же самое.

Premailer. io

Монитор кампании CSS Inliner

Отзывчивый Email CSS Inliner

Mailchimp CSS Инструмент Inliner

<!-- Test Example -->
<html>
  <div style="color: blue;">Blue</div>
  <div class="warning">Red</div>
</html>

<style>
.warning {
  color: red;
}
</style>

<!-- Output -->
<html>
  <div style="color: blue;">Blue</div>
  <div class="warning" style="color: red;">Red</div>
</html>

<style>
.warning {
  color: red;
}
</style>

0 голосов
/ 26 марта 2020

Вот два пакета, которые делают то, о чем спрашивает OP

https://www.npmjs.com/package/juice

https://www.npmjs.com/package/inline-css

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...