如何指定不被 JS 中指定的样式覆盖的样式答案

【问题标题】：How to specify a style not to be overriden by styles specified in JS如何指定不被 JS 中指定的样式覆盖的样式
【发布时间】：2010-03-17 03:04:35
【问题描述】：

我得到了一些元素，它们的样式是由 JS 动态修改的。但是，我希望其中一个不会被修改。

我如何指定它的样式，它是静态的，无论如何都不会被覆盖。谢谢。

【问题讨论】：

您的意思是外部 CSS 中的样式属性或样式规则？还是两者兼而有之？

标签： javascript html css

【解决方案1】：

这是不可能的。 JavaScript 在 CSS 加载和应用后执行。您必须更改您的 ID 和类和/或您的 JavaScript 代码，以便它不会针对您不想更改的元素。

【讨论】：

【解决方案2】：

如您所见，您不能在 CSS 中执行此操作；但是，您可以指示 JavaScript 不更新元素的样式，但这需要一些手动注意。考虑以下几点：

HTML

<ul id="some-list">
    <li>A</li>
    <li>B</li>
    <li class="no-style-update">C</li>
    <li>D</li>
</ul>

JavaScript（原版）

var nodes = document.getElementById("some-list").getElementsByTagName("LI");

for ( var i=0, l=nodes.length; i<l; ++i ) {
    // If style updates are allowed
    if ( !nodes[i].className.match(/\bno-style-update\b/i) ) {
        // Update the element's style
    }
}

【讨论】：

【解决方案3】：

你不能。

您可以做的最好的事情是覆盖进行修改的 javascript 方法。

【讨论】：

【解决方案4】：

简短的回答是你不能。 CSS 在浏览器遇到时应用。由于对 JavaScript 的调用是更改该特定样式的最新调用，因此它将应用于元素。

您可以在第一个脚本之后运行另一个更改特定元素样式的 JavaScript。由于该元素有其独特之处，您可能可以通过其 ID、类或名称来引用它。

【讨论】：

【解决方案5】：

也许您可以将元素放入 iframe 中，其中 src 属性指的是不同的路径或域。然后容器页面中的 javascript 无法修改元素，因为同源规则不允许修改来自不同来源的数据。

【讨论】：