当文字长度超过所需长度时,如何剪裁文字并附加省略号?

你可以用 CSS3 text-overflow property 值为 ellipsis . 此属性是 introduced in IE6 后来被其他主流浏览器采用,Firefox 7是最新增加支持的浏览器:

#mySpan {
  /* IE 6+, Opera 11+, Chrome 1+, Safari 1.3+, Firefox 7+ */
  text-overflow: ellipsis;

  /* IE 8    */ -ms-text-overflow: ellipsis;
  /* Opera 9 */ -o-text-overflow: ellipsis;
}

firefox9将是第一个为这个属性实现双值语法的浏览器,它允许文本的左右两边都有一个值,尽管这个语法目前被认为是有风险的 working draft specification .

This page 有一个非JS的解决方案用于旧版本的Firefox,但它并不完美,并且有一些限制。

你可以用 text-overflow: ellipsis; ,但Firefox不支持它。

if ($("#mySpan").width() > 400) {
     $("mySpan").width(400);
     $("mySpanEllipsis").show();
} 
else {
     $("mySpanEllipsis").hide();
}

你的HTML看起来像

<span id="mySpan"></span><span id="mySpanEllipsis">...</span>

未经测试,因此使用风险自负:-)。