javascript - 有什么方法可以确定元素是否被包装？

Question

基本上，我有一个特定的 HTML 元素(在本例中为 div)，在屏幕分辨率低于平均水平的情况下，由于 float 元素，该元素换行。我想控制这种行为，以不同方式放置和/或设置元素样式(如果它确实当前已包装或将在调整大小/加载时包装)。

这可能吗？

Answer 1

您可以使用 element.getClientRects() 计算文本矩形的数量，它为元素的每个边框返回一个 ClientRect 对象。这必须在内联元素上完成，例如 <span>每行文本都有自己的边框，但使用起来很简单:

window.onresize = function () {
    var span = document.getElementById("myDiv").getElementsByTagName("span")[0],
        rect = span.getClientRects();

    if (rect.length > 1) // more than 1 line of text
        doSomethingWithElement(span.parentNode);
}