使用jquery仅获取省略号文本

Question

好的代码,只是想知道是否有可能查询并获得省略号文本(即带有点而不是原始文本)？

如果我添加文字

这是一个长句

和(使用相关的省略号的CSS)它缩短为

这是一个长期的...

有没有办法得到文本

"This is a long sen ..." 

从$("p")DOM对象而不是原始文本？

Answer 1

我有一个粗略的草案，需要一些特定于浏览器的调整。

\n\n

JavaScript：

\n\n

jQuery.fn.getShowingText = function () {\n    // Add temporary element for measuring character widths\n    $(\'body\').append(\'<div id="Test" style="padding:0;border:0;height:auto;width:auto;position:absolute;display:none;"></div>\');\n    var longString = $(this).text();\n    var eleWidth = $(this).innerWidth();\n    var totalWidth = 0;\n    var totalString = \'\';\n    var finished = false;\n    var ellipWidth = $(\'#Test\').html(\'&hellip;\').innerWidth();\n    var offset = 7; // seems to differ based on browser (6 for Chrome and 7 for Firefox?)\n    for (var i = 0;\n    (i < longString.length) && ((totalWidth) < (eleWidth-offset)); i++) {\n        $(\'#Test\').text(longString.charAt(i));\n        totalWidth += $(\'#Test\').innerWidth();\n        totalString += longString.charAt(i);\n        if(i+1 === longString.length)\n        {\n            finished = true;\n        }\n    }\n    $(\'body\').remove(\'#Test\'); // Clean up temporary element\n    if(finished === false)\n    {\n        return totalString.substring(0,totalString.length-3)+"\xe2\x80\xa6";\n    }\n    else\n    {\n        return longString;\n    }\n}\nconsole.log($(\'#ellDiv\').getShowingText());\n

\n\n

CSS：

\n\n

#Test {\n    padding:0;\n    border:0;\n    height: auto;\n    width: auto;\n    position:absolute;\n    white-space: pre;\n}\ndiv {\n    width: 100px;\n    white-space: nowrap;\n    border: 1px solid #000;\n    overflow:hidden;\n    text-overflow:ellipsis;\n    padding:0;\n}\n

\n\n

需要注意的是，offset需要根据浏览器进行更改，除非有人能够找出导致它的原因。

\n\n

我怀疑letter-spacing或类似？

\n