根據元素高度拆分段落的最有效方式

Question

將超長HTML段落元素動態拆分爲給定高度的較小段落的最有效方法是什麼？

下面的函數（jQuery）每次從文本中遞歸地剔除一個單詞，檢查新的長度，並在文本分解爲可接受的小塊時停止。

function split_par(element, max_height) 
{ 
    if (element.height() <= max_height) 
    return; 
    var array = element.text().split(" "); 
    var pos = 0; 
    while (element.height() > max_height) 
    { 
    pos -= 1; 
    element.html("<p>" + array.slice(0,pos).join(" ") + "</p>"); 
    } 
    var next_par = element.clone(); 
    next_par.html("<p>" + array.slice(pos).join(" ") + "</p>"); 
    $('body').append(next_par); 
    split_par(next_par, max_height); 
} 

這是效率低下，需要很長時間，但它是我找到的最可靠的方法。我確定有更好的方法。我也不熟悉Javascript或jQuery，所以關於代碼的任何一般提示都將不勝感激。

Answer 1

也許將文本放在容器元素（例如divs）中，並使用諸如Jquery Masonry之類的東西就可以實現。