带有 NO_MODIFICATION_ALLOWED_ERR DOM 异常 7 的 Chrome 错误

Posted 2023-02-22

【中文标题】带有 NO_MODIFICATION_ALLOWED_ERR DOM 异常 7 的 Chrome 错误

【英文标题】：Chrome error with NO_MODIFICATION_ALLOWED_ERR DOM Exception 7

【发布时间】：2011-02-01 01:51:08

【问题描述】：

我有以下代码将样式插入 DOM（有一个将样式注入 DOM 的用例，所以请不要问为什么或说要在 .css 文件中加载 css）。

<script type="text/javascript">
window.onload = function()

    var bmstyle = document.createElement('style');
    bmstyle.setAttribute('type', 'text/css');
    var styleStr = "#test-div background:#FFF;border:2px solid #315300;";
    bmstyle.innerhtml = styleStr;
    document.body.appendChild(bmstyle);


</script>

如果我在 Firefox 中运行，它可以正常工作。但是我在 Google Chrome 中遇到了这个错误：

Line bmstyle.innerHTML = styleStr;
Uncaught Error: NO_MODIFICATION_ALLOWED_ERR: DOM Exception 7

有人解决了吗？谢谢

【问题讨论】：

看起来我的问题在这里描述了code.google.com/p/chromium/issues/detail?id=3976#makechanges 所以我想知道“有没有办法解决？？”谢谢

【参考方案1】：

我也是，我也有这个问题，试试这个：

bmstyle.value = styleStr;

【参考方案2】：

尝试使用：

<f:view xmlns:f="http://java.sun.com/jsf/core" contentType="text/html" />

【参考方案3】：

只是一个注释以供将来参考...我正在使用以下函数来动态创建 CSS 样式。我发现使用 textContent 效果最好。

这在 Safari 上会中断

el.innerHTML = css.join('\n'); 

这在 FireFox 上会中断

el.innerText = css.join('\n');

以下是我在两种浏览器上都可以使用的最终代码。 IE 未测试...

/**
* Write out stylesheets to the page.
* 
* @param array css
*/
function print_css(css) 
    var headTag = document.getElementsByTagName('head')[0],
        el = document.createElement('style');

    el.type = 'text/css';
    el.textContent = css.join('\n');
    headTag.appendChild(el);

【参考方案4】：

使用innerText / textContent。 或者创建一个带有样式的文本节点，并将其添加到样式标签中。 不是因为样式在body里，加上你总是可以加到head里，这并不能解决问题。

【参考方案5】：

这可能是因为将<style>元素放在正文中是无效的，但老实说我会感到惊讶

【参考方案6】：

我认为这是因为您使用的是innerHTML，而其他任何地方您都在使用 XML 语法。试试：

bmstyle.nodeValue = styleStr;

建议二：

这也可能是因为您试图设置一个尚未在 HTML DOM 中的元素的 innerHTML。如果是这样的话，我的第一个建议应该仍然成立，或者你可以选择：

document.body.appendChild(bmstyle);
bmstyle.innerHTML = styleStr;

我不确定您是否需要在中间添加一条线来回收元素，或者 bmstyle 是否仍会指向它。

【讨论】：

我应该提一下，由于本例中的 DOM 是 HTML DOM，所以没关系。但是当你没有将 DOM Element 变量显式设置为 HTML 时，Chrome 可能会很生气。

我使用了您的建议 2，但仍然有错误。我将建议 1 与 nodeValue 一起使用，它没有错误，但样式标签中没有任何内容（顺便说一句，我更正了在末尾添加 ）。我应该插入标题吗？如何插入？

谢谢！很有帮助

当我使用它时，控制台出现：HierarchyRequestError，有什么想法吗？...浏览器是IE