window.matchMedia在Safari中不起作用

Question

为什么以下代码在Safari中不起作用？

window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', () => {
 console.log('theme changed');
});

Answer 1

如here on caniuse.com和here on mozilla.org所述，MediaQueryList.addEventListener在Safari和IE中不起作用，但是您可以使用MediaQueryList.addListener：

较旧的浏览器应使用addListener而不是addEventListener，因为MediaQueryList仅在较新的浏览器中继承自EventTarget。 [source]