html - 复制 wtikay - IE - currentStyle 在应该更新时没有更新

标签 html css internet-explorer

我正在尝试用我自己的代码复制在 http://wtikay.com/ 上看到的历史嗅探演示和其他各种地方。 (说来话长。)

我有一些东西可以在大多数旧浏览器中可靠地工作(最新的 Safari 和 Chrome 版本以及 Firefox 4 beta 有防御)——但它在 IE7 或 8 中不起作用(没有尝试过 6),我不能找出原因。当我更改 a 元素上的 href 属性时,IE 似乎并没有费心更新它的呈现——但据我所知,这是正是 wtikay 所做的,而且它有效。

测试文件:

<!doctype html>
<html><head>
<title>gevalt</title>
<style>
  body { background-color: gray }
  a:link { text-decoration: none; color: black }
  a:visited { color: white }
</style>
<body>
<span id="container"><a href="" id="testlink">test</a></span>
<a href="ftp://">minus</a>
<a href="http://www.google.com/">plus</a>
<script>
window.onload = function()
{
    var testlink = document.getElementById("testlink");
    var results = document.getElementById("results");
    var container = document.getElementById("container");
    var report = "";

    testlink.href = "ftp://";
    container.removeChild(testlink);
    container.appendChild(testlink);
    report += " -" + (testlink.currentStyle || window.getComputedStyle(testlink, "")).color;

    testlink.href = "http://www.google.com/";
    container.removeChild(testlink);
    container.appendChild(testlink);
    report += " +" + (testlink.currentStyle || window.getComputedStyle(testlink, "")).color;

    results.appendChild(document.createTextNode(report));
};
</script>
<pre id="results">
</pre>
</body></html>

在它运行的浏览器中,“test”和“plus”字样为白色(假设您在该浏览器中访问过 www.google.com),“minus”字样为黑色,并打印下面是类似“-rgb(0,0,0) +rgb(255,255,255)”的东西。在 IE 中,“test”将是黑色而不是白色,并且在其下方将显示为“-black +black”。或者“test”可能是白色的,但在它下面会显示“-white +white”。这两个都是失败的。

如有任何帮助,我们将不胜感激。

最佳答案

郑重声明:要在 IE 中正常运行,您必须替换 <a>元素与一个全新的元素,每次你想让它注意到 href 的变化时, 并且必须将新元素添加到文档中。

6、7、8是这样;我还没有尝试过 v9 测试版。

window.onload = function()
{
    var testlink;
    var results = document.getElementById("results");
    var container = document.getElementById("container");
    var report = "";

    testlink = document.createElement("a");    
    testlink.href = "ftp://";
    container.appendChild(testlink);
    report += " -" + (testlink.currentStyle || window.getComputedStyle(testlink, "")).color;

    container.removeChild(testlink);
    testlink = document.createElement("a");
    testlink.href = "http://www.google.com/";
    container.appendChild(testlink);
    report += " +" + (testlink.currentStyle || window.getComputedStyle(testlink, "")).color;

    results.appendChild(document.createTextNode(report));
};

关于html - 复制 wtikay - IE - currentStyle 在应该更新时没有更新,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/4057151/

相关文章:

CSS 表格无法正确对齐图像

html - IE 乱七八糟格式化其他浏览器没问题

css - 如何在尊重 Internet Explorer 11 中的最大高度继承的同时滚动固定标题下的内容?

javascript - 使用 JavaScript 更改 IE 中的背景图像

html - 将文本保留在一个 Div 中

javascript - 如何在 Javascript 中使用逻辑运算结果?

javascript - 有时间自动在输入类型="time"

php - $_POST[] 的默认值;

html - 仅使用 css,将 div 放置在另一个使用 vh 单位的 div 中

javascript - JS : mouseOver function: new state doesn't pick up css from the old state