2

对于这样的 div

<div style="width:200px;">
    <span>Element 1</span>
    <span>Element 2</span>
    <span>Element 3</span>
    <span>Element 4</span>
    <span>Element 5</span>
</div>

如何使用 javascript 或 Prototype JS 计算最后一个 span 元素右侧的剩余空间。Span 元素具有动态宽度，我必须在 div 的最后一行右侧找出剩余的空白空间。

4

2 回答 2

1

您可以尝试以下方法：

var div = $("divId"); // Get the extended div element
var width = div.measure("width");
var offset = div.cumulativeOffset();

var span = document.createElement("span");
div.appendChild(span); // Append an empty span at the end of the last line
var spanOffset = span.cumulativeOffset();

var emptySpace = (width - (spanOffset.left - offset.left)) % width;
span.remove();

根据 div 样式（边框、填充等），这可能会变得更加复杂

于 2013-02-07T18:02:09.923 回答
0

这是我从父 div 开始的方式...

var t = $$('div span')[4];

var width = t.up().getWidth() - t.getWidth();

您可以根据自己的喜好修改 CSS 选择器，$$()但我是基于您提供的 HTML。

http://api.prototypejs.org/dom/Element/prototype/getWidth/

于 2013-02-07T00:12:17.630 回答