是否可以在javascript中使用css3線夾？

目前爲了垂直限制一個文本框，並添加省略號，那裏只有一個webkit css3解決方案，它採用了面向盒子的線夾&。是否可以在javascript中使用css3線夾？

演示（Safari或鉻）：http://jsfiddle.net/ArKeu/136/

現在，這是不支持其他任何地方，即使不使用前綴。所以我的問題是如果可以在純JavaScript中輕鬆完成此操作。簡而言之，讓一個句子在多行上流動，並在添加省略號後添加一個句子來停止它。

感謝您的幫助。

2012-08-08 cmplieger

可能重複的[使用CSS，使用「...」爲多線溢出塊（ http://stackoverflow.com/questions/6222616/with-css-use-for-overflowed-block-of-multi-lines） – sachleen 2012-08-08 01:29:52

也是http://stackoverflow.com/questions/3404508/cross-browsers-mult-lines-text-overflow-with-ellipsis-appended-within-a-widthhe – sachleen 2012-08-08 01:30:15

是的，但這是所有的jQuery :( – cmplieger 2012-08-08 02:01:04

我將代碼格式this answer修改爲pure-JS。您不指定行數，而是指定框的高度。您可以通過將行數乘以line-height來輕鬆計算行數。

HTML

<div id="fos"> 
    <p>text here</p> 
</div>

的JavaScript

var container = document.getElementById("fos"); 
var containerHeight = container.clientHeight; 
var para = container.children[0]; 

while (para.clientHeight > containerHeight) { 
    para.innerText = para.innerText.replace(/\W*\s(\S)*$/, '...'); 
}

DEMO

的

來源

2012-08-08 02:31:34 sachleen

要小心，有些語言不使用空格字符來分隔單詞 – 2017-08-07 22:02:19

是否可以在javascript中使用css3線夾？

回答

相關問題