Javascript Chrome Resize事件和getComputedStyle

我对resize事件和getComputedStyle方法有问题。当我将窗口从700px调整到800+px时，我的元素的高度从79px变为默认值（10px）。但是当我想通过getComputedStyle获取这个值（10px）或者在devtools中检查它时，会有这样的输出：76、63、59，最后是10px。 所以devtools中的高度值在下一个调整大小事件时更新，而不是在第一个事件时更新，并且每个调整大小事件之间都有一些中间值。 所以我的问题是，如何得到最终的值？我尝试使用setTimeout方法调整大小，但这也不能像我预期的那样工作。我的代码如下所示：

window.addEventListener("DOMContentLoaded", function(){
    if(window.matchMedia("(min-width:800px)").matches){
        default();  
    }
    else{
        changeHeight();
    }
    window.addEventListener('resize',onResizeFunction);


})
function default(){
    slot.parentElement.style.height=''
    console.log(slot.parentElement.style.height) 
    console.log(getComputedStyle(slot.parentElement).height)  //problem with this line, when called in resize event it's output something like this: 76,63,59 and then 10px;

}

function changeHeight(){
    slot.parentElement.style.height="79px";
    console.log(slot.parentElement.style.height)  //this is ok

}

function onResizeFunction(){

    if(window.matchMedia("(min-width:800px)").matches){
        default();
    }
    else{
        changeHeight();
    }

}

---

我不能使用CSS，因为我正在处理一个旧项目，只能使用JS来完成这项工作。请为您的dom提供CSS，我打赌您有一些转换，请为您的dom提供CSS，我打赌您有一些转换，好的，问题解决了，正如您所说，当我禁用它们时，是转换的问题，它按我的预期工作OK，问题解决了，正如你们所说，这是过渡的问题，当我禁用它们时，它按我的预期工作