你可以调用基于div大小的JavaScript方法吗？

Question

我想知道是否有除jQuery之外的任何方式来运行JavaScript代码的基础上，如果div的大小达到一定的大小范围？所以如果用户拖动他们的浏览器窗口大约是屏幕的一半，我想在JavaScript中设置一个变量值，如果他们再次使其全屏（这使得div更大），我想要这个变量值设置回原始值。

总之，我想要根据div的大小变小或大于某个指定的断点大小（比如200px）来切换JavaScript变量。

这可能吗？

Answer 1

您可以使用.offsetWidth和.offsetHeight属性。

render(); 

function render() { 
    var width = document.getElementById('yourDivID').offsetWidth; 
    if (width < 200) { 
     foo(); 
    } 
    else { 
     bar(); 
    } 
} 

window.addEventListener('resize', render);