Question

我基本上想要动态地将一些样式应用于页面中的所有元素，我知道document.all是IE专有的，那么，DOM中的等价（如果有的话）是什么？ DOM中的css中是否有等效的*？

注意：不要为此使用JQuery或任何其他JS库，只需JS，谢谢

Answer 1

使用document.getElementsByTagName('*')

The World Wide Web Consortium给出了此方法的明确说明（搜索getElementsByTagName）。

Answer 2

正如Scharrels所说，您可以使用 document.getElementsByTagName('*') 。但是您应该注意，将样式应用于页面上的每个元素都会影响性能。最好动态创建 <style> 标记并在其中添加样式：

function addStyles(styles) {
    var styleTag = document.createElement('style');
    styleTag.type = 'text/css';
    try {
        styleTag.appendChild(document.createTextNode(styles));
    } catch(e) {
        /* Exception thrown in IE */
        styleTag.stylesheet.cssText = styles;
    }
    document.getElementsByTagName('head')[0].appendChild(styleTag);
    return styleTag;
}

用法：

addStyles('* { color: red; }');

Answer 3

是的，我刚刚在Safari，Explorer6，Opera和Firefox上测试了 ~~documentAll~~ document.getElementsByTagName（“*”），似乎对所有人都有效:) / p>

Answer 4

将样式应用于所有元素并不是您通常会做的事情，那么您要将它用于什么？

有些样式无法应用于所有元素。例如，select元素不支持在所有浏览器中设置边框。在内联元素上设置边距会产生不同的意外结果......

某些样式是继承的，因此，如果您将body-size应用于body元素，那么任何尚未设置特定字体大小的元素都会继承该样式。

您可以使用CSS中的级联来更改许多元素的样式。例如，如果你定义了这种风格：

.highlight div.info { background: #ffc; }
.highlight strong { color: #f00; }

将bodyName =“highlight”设置为body标签将为每个div提供class =“info”浅黄色背景和每个强元素红色文本。

什么是IE的document.all在DOM中的等价物？

4 个答案: