window.matchMedia 在 Safari 中不起作用

Question

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

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

Answer 1

正如caniuse.com 上的此处和mozilla.org 上的此处所述，MediaQueryList.addEventListener在 Safari 和 IE 中不起作用，但您可以使用MediaQueryList.addListener：

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