Javascript 使用JS确定DOM元素媒体样式

我想知道DOM元素的

display

CSS。通常我会使用类似于

document.getElementById（'hello-world'）.style.display的东西，但是当使用CSS@media Rule设置样式时，我看不到此值有任何更改

有什么原因吗？
我怎样才能得到这些信息

下面是一个要演示的示例

代码：
HTML

JS

你可以用

window.getComputedStyle（document.getElementById（'hello-world'））.display

但是，在设置样式和页面重新流动之间可能会有延迟，这可能不是所有浏览器都可以使用的

<p id="hello-world">Hello world</p>

@media (min-width: 980px) {
  #hello-world {
    display: none;
  }  
}

window.addEventListener('resize', function(){
  console.log(document.getElementById('hello-world').style.display)
})