在实际工作中，很多时候都会有几行几行之后显示省略号的需求，都知道单行省略号的需求很简单，三个属性就实现了(overflow: hidden;text-overflow:ellipsis;white-space:nowrap;),但是多行的话，就稍微麻烦一些了，网上也有很多实现方法，但很多都不兼容，那下面就说一下用js实现多行之后多余的显示省略号。
html:
<div class="div0">
点击修改高度：
<input type="radio" class="radio" value="50">50px
<input type="radio" class="radio" value="80">80px
<input type="radio" class="radio" value="110">110px
<input type="radio" class="radio" value="140">140px
</div>
<div class="div">
这是一种土方法，小时候常玩儿。背靠墙或椅背，以头枕部向后顶墙，头和身体不动，肌肉紧张收缩，后来听人说这叫"绷劲儿”；或者双手交叉放在头枕部，双手向前使劲儿，头枕部向后使劲儿，相互对抗，头颈不动。锻炼时，颈项部的肌肉持续紧张3?5秒，放松休息3?5秒为1个周期。每天锻炼100?200次，分5-10组完成。
</div>
css:
* {
margin:0;
padding:0
}
html {
font-size:14px;
}
.div0 {
margin:30px;
}
.div {
width:300px;
height:50px;
line-height:24px;
border:1px solid #333;
margin:30px;
padding:5px;
}
js:
$(function(){
var div = $(".div");
var font_s = parseInt(div.css("font-size"));
var line_h = parseInt(div.css("line-height"));
var div_h = div.height();
var div_w = div.width();
var len = Math.floor(div_w/font_s);
var con = div.text();
var con2 = con;
var con_new = Math.floor(div_h/line_h);
con2 = con2.replace(con2.substring(len*(con_new-1)+6,con2.length),"...");//替换
div.text(con2)
$(".radio").click(function(){
$(this).attr("checked","checked").siblings().removeAttr("checked");
div.height(this.value);
div_h = div.height();
var con_new = Math.floor(div_h/line_h);
con3 = con.substring(0,len*(con_new-1)+6);//截取
div.text(con3 + "...")
})
})