时间戳

首页 > 解决方案 > Angular动态改变类样式内容

html - Angular动态改变类样式内容

问题描述

我知道我想动态更改内容的类的名称。所以我不需要通过它的 id 来获取任何元素。我只是想随时更改课程的内容。

我无法在 html 中添加 class 或 ngclass，因为此 html 不是在我自己的代码中生成的

例如，假设类是这样的：

.garden {
color = white;
}

我只想将内容更改为

.garden {
color = red;
}

并将其应用于所有具有此类样式的 HTML 元素

我该怎么做？我没有找到像 document.getCssByName("garden") 这样的方法

谢谢

标签： htmlcssangulartypescriptstyles

解决方案

如果您有类名，则可以执行以下操作作为解决方法：

const cssClass = '.garden {color = red !important;}';
style = document.createElement('style');
document.head.appendChild(style);
style.type = 'text/css';
style.id = 'myTempStyle';
if (style.styleSheet){
  style.styleSheet.cssText = css;
} else {
  style.appendChild(document.createTextNode(css));
}

对于删除：

documet.getElementById('myTempStyle').remove();

推荐阅读