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

Question

基本上，我有一个HTML元素（在这种情况下，div），由于浮动元素，在低于平均值的屏幕分辨率的情况下包装到新行。我想控制这种行为，如果它确实当前被包装或将在resize / onload上包装，则以不同方式放置和/或样式化元素。

这可能吗？

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);
}