Javascript：如何判断 span 是否断成两行

html
<!DOCTYPE html>
<html>
<body>
<style>
    .contAIner {
        width: 200px;
        font-size: 16px;
    }
</style>
<div class="contAIner">
    <span id="text">这是一段很长的文本内容，可能会断成两行。</span>
</div>
<script>
    var contAIner = document.querySelector('.contAIner');
    var text = document.querySelector('#text');
    // 获取<span>元素的高度
    var spanHeight = text.offsetHeight;
    // 改变<span>的内容
    text.innerHTML = '这是一段短文本';
    // 获取改变后的<span>元素的高度
    var newSpanHeight = text.offsetHeight;
    // 判断<span>是否断成两行
    if (spanHeight !== newSpanHeight) {
        console.log('这个<span>元素断成两行了！');
    } else {
        console.log('这个<span>元素没有断成两行。');
    }
</script>
</body>
</html>