Home/ Questions/Q 3357244
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-18T02:36:36+00:00

I am trying to replicate, with my own code, the history-sniffing demo seen on

  • 0

I am trying to replicate, with my own code, the history-sniffing demo seen on http://wtikay.com/ and various other places. (It’s a long story.)

I have something that works reliably in most older browsers (latest Safari and Chrome releases and Firefox 4 betas have a defense) — but it doesn’t work in IE7 or 8 (haven’t tried 6), and I cannot figure out why. It seems to be that IE just isn’t bothering to update its rendering when I change the href property on an a element — but as far as I can tell, that’s exactly what wtikay does, and it works.

Test file:

<!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>

In a browser where it works, the words “test” and “plus” will be white (assuming you have visited http://www.google.com in that browser), the word “minus” will be black, and it will print something like “-rgb(0,0,0) +rgb(255,255,255)” underneath. In IE, “test” will be black instead of white, and underneath it will read “-black +black“. Or possibly “test” will be white but underneath it will read “-white +white“. Both those are failures.

Any help would be most appreciated.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    For the record: to make this work in IE, you have to replace the <a> element with an entirely new one, every time you want it to notice a change in the href, and the new element must be added to the document.

    This is the case in 6, 7, and 8; I haven’t tried the v9 betas.

    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));
};
    • 0