JavaScript removeAttribute 在 IE 中不适用于 href 和 onclick 值

Question

我正在制作一个在线降临节日历，您只能在当天打开门。所有门都使用 JavaScript onclick 来显示报价，例如“door10”...

<a href="javascript:void(0)" onclick = "document.getElementById('door10').style.display='block';document.getElementById('fade10').style.display='block'" id="door-10-link">

它们都是通过此 onclick 创建的，然后在 HTML 末尾运行以下 JavaScript 函数，该函数删除了今天不存在的门的 href 和 onclick 属性，从而消除了打开它们的能力。

function disableDoor(num) {
var today = new Date();
var day = today.getDate();
var calendar_day = num;
if (calendar_day == day) {          
} else {
    var string = "door-" + num + "-link";
    var d = document.getElementById(string);
    d.removeAttribute("href");
    d.removeAttribute("onclick");
}

除了 Internet Explorer 之外，这一切都运行良好，其中门仍然可以点击，即使它们不应该点击。光标不会更改为悬停光标，并且如果您检查元素，href 和 onclick 值已被正确删除，但即使没有声明 href，您仍然可以“打开门”。 HTML 现在看起来像这样，正确删除了属性...

<a id="door-10-link">

在 IE 检查器中，如果我“编辑为 HTML”，则不要更改任何内容，单击外部完成编辑并刷新页面，一切正常，我无法单击不应该单击的门。 href 元素已从页面中正确删除。

JavaScript 运行后，页面上的元素似乎需要刷新或执行其他操作。我猜这可能与 DOM 有关，但我对这个领域还很陌生。

任何帮助都会很棒，因为它让我陷入困境。

提前致谢

Answer 1

这似乎是 Internet Explorer 11 中的回归；我检查了 Internet Explorer 9 和 10，两者都没有重现该问题。我已在内部提交了一个错误，以便我们的团队尽快解决该问题。您可以查看http://remote.modern.ie如果你愿意，就继续前进。我构建了a small fiddle这说明了问题。

对于这个特定的项目，我实际上鼓励您采取替代路线并建立一个事件监听器，而不是有条件地拆除数十个预先存在的监听器。作为我的意思的一个简单示例，请考虑以下内容:

(function () {

    "use strict";

    var day = (new Date).getDate(),
        doors = document.querySelectorAll( "div" );

    doors.item( --day ).addEventListener( "click", function openDoor () {
        this.classList.toggle( "open" );
    });

}());

在上面，只有今天的门会解锁 - 所有其他门都将保持锁定状态。您可以在线查看实际演示:http://jsfiddle.net/jonathansampson/n4ed6uw5/ .

我希望这个解决方法有所帮助；与此同时，我将与我的团队合作解决回归问题。