Question

如果在load上添加HTMLLinkElement事件侦听器，则event在Firefox中被触发两次。（您可以通过在Firefox和Chrome中运行以下代码段来查看差异）。

var linkCss = document.head.appendChild(document.createElement('link'));
linkCss.setAttribute('rel', 'stylesheet');
linkCss.setAttribute('href', 'https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css');
linkCss.setAttribute('type', 'text/css');
linkCss.addEventListener('load', function (event) {
    console.log('CSS Loaded');
});

我当前的firefox版本是：68.0.1 (64 bit)

这是一个错误吗？

Answer 1

我找不到任何规范中是否定义了预期的行为，但是请注意，如果在将元素插入DOM中之前准备好元素，则只会触发一个 load 事件：

var linkCss = document.createElement('link');
linkCss.setAttribute('rel', 'stylesheet');
linkCss.setAttribute('href', 'https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css');
linkCss.setAttribute('type', 'text/css');
linkCss.addEventListener('load', function (event) {
    console.log('CSS Loaded');
});

document.head.appendChild(linkCss)

如果首先将元素附加到DOM，则在设置“ href”属性时触发第一次加载，而在设置“ type”属性时触发第二个加载。

Firefox两次触发CSS载入事件

1 个答案: