自定义 Javascript 未在 Internet Explorer 9 和 10 中触发答案

【问题标题】：Custom Javascript not firing in internet explorer 9 and 10自定义 Javascript 未在 Internet Explorer 9 和 10 中触发
【发布时间】：2013-06-12 21:44:15
【问题描述】：

首先这是位于我文档头部的脚本。

<script>
    document.addEventListener("DOMContentLoaded", function () {
        var e, t = document.querySelectorAll("div.bounceInDown");
        for (var n = 0, r = t.length; n < r; n++) {
            e = Math.round(Math.random() * 7e3) + "ms";
            t[n].style.animationDelay = e;
            t[n].style.WebkitAnimationDelay = e
        }
    }, false)
</script>

现在我有一个名为“bounceInDown”的类，它有一个关键帧动画。当网站加载时，应用了这个二级类的所有 div 元素都应该弹回。现在，那里的脚本使弹跳具有不同的延迟值。它只是在 Internet Explorer 中不起作用。不知道为什么。我的代码有什么问题？

它适用于除 IE 以外的所有浏览器

【问题讨论】：

请格式化代码以使其可读（即使用多行和适当的缩进）。谢谢！
stackoverflow.com/questions/1695376/… addEventListener 不适合 IE。
@user2239256 addEventListener 从 IE9 开始受支持：msdn.microsoft.com/en-us/library/ie/ff975245%28v=vs.85%29.aspx
我打赌你的 IE 正在 IE7 模式下运行。按 F12 看看它在什么模式下运行。
动画延迟不是IE10+吗？我认为这将是IE9的问题。当你让它运行时。

标签： javascript html internet-explorer css

【解决方案1】：

对于初学者来说，IE9 不支持animation，这只是在 IE10 中添加的：p

除此之外，它可能在DOMContentLoaded 事件有机会更新延迟之前开始动画。与其在 CSS 中设置动画，在 JS 中调整延迟，不如在 JS 中设置整个动画：

t[n].style.animation = "yourAnimationName 1s "+e;

（将 1s 替换为您的动画持续时间）

【讨论】：