如何在JavaScript中添加、删除或禁用CSS规则？

有没有办法在JavaScript中添加、删除或禁用CSS规则？以下是CSS：

#myElement *, #myElement *:before {
   outline:1px dotted red;
}

以下是我到目前为止的情况：

var myCSS = "#myElement *, #myElement *:before {outline:1px dotted red;}";
// document.addCSS(myCSS);

编辑：

---

我无法将规则添加到HTML页面并在它们之间切换。我需要能够在页面加载后在JavaScript中创建一个规则，并在JS中打开和关闭它

通常的做法是使用类来打开/关闭样式。例如：

#myElement.outline *, #myElement.outline *:before {
  outline:1px dotted red;
}

---

然后，在本例中，您可以根据需要通过javascript添加/删除outline类。

您可以按如下操作：

var sheet = document.styleSheets[0];
sheet.insertRule(".foo { color:pink; }", sheet.cssRules.length);

除了在internet explorer上，您可以使用className属性添加类

您可以使用类列表添加多个类和删除类

---

似乎您可以在Mozilla开发者网络上找到答案：

在当前样式表中插入新的CSS规则

例如：

// create a style sheet and add rule
var borderStyleSheet = document.createElement("style");
document.head.appendChild(borderStyleSheet);
borderStyleSheet.sheet.insertRule("#myElement *{ outline: 1px solid red;}", 0);

// disable rule
borderStyleSheet.disabled = true;

// enable rule
borderStyleSheet.disabled = false;

// see existing stylesheets
console.log(document.styleSheets);

---

您的问题不清楚。预期输出是什么？我的问题与链接的问题不同，因为我还必须能够删除或禁用该规则。我的问题与标记为重复的问题不同。我的问题是如何删除或禁用。链接问题不提供这些信息。虽然此链接可以回答问题，但最好在此处包含答案的基本部分，并提供链接以供参考。如果链接页面发生更改，仅链接的答案可能无效。-谢谢@Shadow，这是一个比“不，不，不，…”好得多的反馈。@torazaburo，我说过这是一个好的练习吗？没有，我回答问题了吗？是的，谢谢@gigawatts，希望有帮助，顺便说一句，我同意如果你遵循更好的模式，比如添加或删除类，那可能是最好的。我没有投你反对票。OP的问题是如何打开或关闭规则。@torazaburo:-他说以后使用任何javascript条件删除…不是说正确切换功能？？只有在过时的情况下，才需要添加规则，不受支持的IE版本谢谢，我编辑了我的答案以反映这一点。

document.getElementById("myElement").className += " MyClass";

 document.getElementById("myElement").classList.add('newclass');

 document.getElementById("myElement").classList.remove('newclass');

// create a style sheet and add rule
var borderStyleSheet = document.createElement("style");
document.head.appendChild(borderStyleSheet);
borderStyleSheet.sheet.insertRule("#myElement *{ outline: 1px solid red;}", 0);

// disable rule
borderStyleSheet.disabled = true;

// enable rule
borderStyleSheet.disabled = false;

// see existing stylesheets
console.log(document.styleSheets);