超长显示省略号...，兼容各浏览器，适用于多行

超长显示省略号是一个很困扰的事情，各个浏览器的对css的解析不同，比如

1. IE可以使用overflow:hidden;white-space:nowrap;text-overflow:ellipsis，

2. Opera中也有相关的支持属性text-overflow:-o-ellipsis-lastline

3. 新版的chrome中有一个属性-webkit-line-camp属性，它允许你指定特定行数省略。-webkit-line-camp：3

以下的脚本可以直接复制后作为一个新的js文件引用，在使用的时候可以这样：dom元素.mlellipsis(最大行数)，这样改dom元素会在最大行数时截取并显示...

但这样会有个问题就是如果进行响应式开发，当浏览器resize时，已经截取显示...的文字是没法再恢复的，所以需要在页面load时将控件的文字存储，并在resize时取出重新赋值。

以下两个方法是我用jquery做的用于存储和恢复内容的，其实相当于是存储在一个“fulltext”的属性值里。

//画面load的时候调用

        function storeText(){
            $("..actTitle a").each(function(){$(this).attr("fulltext",$(this).text());});
        }

//画面resize时调用
        function resetText(){
            $(".actTitle a").each(function(){$(this).text($(this).attr("fulltext"))});
        }

//以下内容可以直接赋值到一个新的js文件里，在页面引用。

; (function () {

    Element.prototype.getText = function () {

        //IE:innerText    FF:textContent

        if (this.innerText == undefined) {
            return this.textContent;
        }
        else {
            return this.innerText;
        }
    };
    Element.prototype.setText = function (str) {
        if (this.innerText == undefined) {
            this.textContent = str || "";
        }
        else {
            this.innerText = str || "";
        }
    };
    Element.prototype.getFinalStyle = function (property, fontSize) {

        var s;

        //IE:currentStyle   FF:getComputedStyle

        if (window.getComputedStyle) {
            s = window.getComputedStyle(this, null)[property];
        }
        else {
            s = this.currentStyle[property];
        }
        if (s.indexOf("px") > 0) {
            s = s.substring(0, s.toString().length - 2);
        }
        if (fontSize != undefined) {
            s = s * fontSize + "px";
        }
        if (s.indexOf("px") > 0) {
            return s.substring(0, s.toString().length - 2);
        }
        else {
            return s;
        }
    };
    Element.prototype.mlellipsis = function (row) {
        var str = this.getText();
        var title = this.getAttribute("title");
        if (title == null) {
            this.setAttribute("title", str);
        }
        else {
            this.setText(title);
        }
        var fontSize = this.getFinalStyle("fontSize");
        if (/msie/i.test(navigator.userAgent)) {
            var lineHeight = this.getFinalStyle("lineHeight");
        }
        else {
            var lineHeight = this.getFinalStyle("lineHeight");
        }
        var height = this.clientHeight;
        if (!height && height == 0) {
            height = this.offsetHeight;
        }
        if (lineHeight == "normal") {
            lineHeight = Number(fontSize * 1.5);
            var nowStyle = this.getAttribute("style") || "";
            this.setAttribute("style", nowStyle + ";line-height:" + lineHeight + "px");
        }
        else {
            lineHeight = Number(lineHeight);
        }
        var dheight = Math.floor(row * lineHeight);
        if (height >= dheight) {
            str = this.getText();
            while (dheight * 3 < this.clientHeight) {
                this.setText(str.substring(0, str.length / 2));
                str = this.getText();
            }
            while (dheight < this.clientHeight) {
                str = this.getText();
                this.setText(str.replace(/(\s)*([a-zA-Z0-9]?|\W)(\.\.\.)?$/, "..."));
            }
        }
    };

})();

说明：本文章参照http://targetkiller.net/mutiple-line-ellipsis/   并对js做了适当修改。