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

发布于 2024-10-15 15:05:40 字数 141 浏览 1 评论 0原文

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

这可能吗？

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

风追烟花雨 2024-10-22 15:05:40

您可以使用 element.getClientRects()，它为元素的每个边框返回一个 ClientRect 对象。这必须在内联元素（例如）上完成，以使每行文本都有自己的边框框，但使用起来很简单：

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

You can count the number of text rectangles it has using element.getClientRects(), which returns a ClientRect object for each border-box of an element. This must be done on an inline element such as a <span> for each line of text to have its own border-box, but it's simple enough to use:

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

回复收藏 0 原文

~没有更多了~