加载CSS文件并覆盖上一个文件

loading css file and override the previous one

本文关键字：文件 上一个 覆盖 加载 CSS      更新时间：2023-09-26

我想在javascript中加载css属性。

我有两个画布，我在 head 标签中加载了一个 css 文件。

我想在选择某个选项时执行此操作，画布的 css 会发生变化。如果它是简单的 css，它可以通过"canvas.style.csstext"来完成，但我正在应用转换来倾斜元素，因此它在"canvas.style.csstext"中不起作用。

那我该怎么做！

好的，我将在这里发布作为答案，以便其他人可以看到。

有多种方法，例如注入link元素或使用document.styleSheets[0].insertRule，但在您的情况下，更好的解决方案是在标头中包含两个CSS文件，使用不同的选择器，并在需要时修改canvas.className。

插图：

<link href="main.css" /> <!--canvas{border:...}-->
<link href="alternate.css" /> <!--canvas.alter{border:...}-->
<!--...-->
<canvas id="needToAlter"></canvas>
<button onclick="document.getElementById('needToAlter').className+=' alter';">Alter</button>
相关文章：