我们经常会出现容器内文字溢出问题，我们可以给容器添加属性:
.className{ overflow:hidden; white-space: nowrap; text-overflow: ellipsis; }
这样文字溢出会出现省略，在样式上好看了很多；但是文字的全部能容却看不见了。由此引发了我的代码风暴，来看下面代码：
$body.on("mouseover",".className",function(){
var div = document.createElement(‘div‘);
div.innerHTML = $(this).text();
var fs = $(this).css("font-size");
div.id = ‘textWidth‘;
div.style.fontSize = fs;
div.style.margin = ‘0‘;
div.style.padding = ‘0‘;
div.style.float = ‘left‘;
$("body").append(div);
var $textWidth = $("#textWidth");
var thisWidth = $(this).width();
var textWidth = $textWidth.width();
if (thisWidth < textWidth) {
$(this).attr("title", $(this).text());
}
$textWidth.remove();
})
原理就是通过虚拟的创建一个容器与容器内文字宽度比较，来判断是否溢出，溢出部分我们给容器添加title属性，将内容显示在title中提示，这样我们就能看见文字所有内容了。
