Question

我有几个像这样的CSS选择器：

table.SearchCustomerResults > thead > tr > th[sortOrder="0"] {}
table.SearchCustomerResults > thead > tr > th[sortOrder="1"] {}

然后我为JavaScript中的每个单元格设置sortOrder扩展属性。但是，在我稍微移动光标之前，在浏览器（IE7，可能是其他）中看不到更改的样式。如何强制重新评估样式？

编辑：我没有按照最初的说法使用IE6，而是IE7。但问题仍然存在。

Answer 1

有各种强制重新渲染的hack-y方法。 script.aculo.us有一个名为forceRerendering的方法（自然地），如下所示：

someElement.appendChild(document.createTextNode(' '));
someElement.removeChild(someElement.lastChild);

这也应该适用于这种情况。

Answer 2

IE6不支持属性或子选择器，因此这根本不起作用。您使用的是ie7-js吗？

好的，我现在看到了。这看起来像IE中的一个错误（使用div和title th和sortOrder有同样的问题。）

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
  <head>
    <style>
      th[sortOrder="0"] {color:red}
      th[sortOrder="1"] {color:blue}
    </style>
    <script>
      function changeSortOrder() {
        // swap the orders so that blue is actually red and vice versa
        document.getElementById("hdr0").setAttribute("sortOrder","1");
        document.getElementById("hdr1").setAttribute("sortOrder","0");
        //document.getElementById("hdr0").innerHTML += "";
        //document.getElementById("hdr1").innerHTML += "";
      }
    </script>
  </head>
  <body onload="changeSortOrder()">
    <table class="SearchCustomerResults">
      <thead><tr>
        <th sortOrder="0" id="hdr0">red</th>
        <th sortOrder="1" id="hdr1">blue</th>
      </tr></thead>
    </table>
  </body>
</html>

修改innerHTML的行似乎解决了这个问题。但是，在Google上找不到任何引用。

Answer 3

我遇到了类似的问题：插入新的div后IE没有申请保证金 下一段代码帮助：
setTimeout（function（）{newDiv.addClass（'tratata'）。removeClass（'tratata'）;}，0）; // jquery语法

如何强制Internet Explorer应用CSS样式

3 个答案: