Question

有一个非常简单的网页微调器

框架nav：

Event.observe(
    'doit',
    'click',
    function(){
      parent.window.frames.cont.spinner.removeAttribute('style');
    },
    false);

框架cont（这是<body>中的第一个元素）：

<div id="spinner" style="display: none;"></div>

CSS：

#spinner {
    width: 50px;
    height: 50px;
    position: fixed;
    top: 50%;
    left: 50%;
    background: url(spinner.gif) transparent no-repeat center;
    margin-left: -25px;
    margin-top: -25px;
    z-index: 2;
}

很简单，它是以<div>框架为中心的固定位置cont，并在浏览器加载页面时隐藏（也是为了避免非JS浏览器中出现问题）。当用户单击nav框架中的按钮时，style属性将被删除，用户将看到微调器，直到下一页接管为止。这在Firefox中运行得很好，但IE 9拒绝工作。这是我从他们的标准 F12 界面中找到的：

只有一个ID为spinner的元素。
在控制台标签中运行parent.window.frames.cont.spinner.removeAttribute('style')或parent.window.frames.cont.document.getElementById("spinner").removeAttribute("style")会返回true，但会导致下一个元素被隐藏！这没有以任何可辨别的方式反映在 HTML 标签中 - 隐藏的元素仍然有style="display: block;"。

我尝试使用Prototype的show()，它在Firefox中有效，但在IE9中没有...

Answer 1

为什么在添加/删除类更容易时删除style属性？无论如何，如果您要做的只是显示/隐藏div，为什么不只更改“display”样式属性？

Answer 2

不要试图删除样式属性，只需将“display”属性设置为“block”。

document.getElementById("spinner").style.display = "block"

如何在IE9中使用JavaScript重置/删除style属性？

2 个答案: