使用CSS样式overflow:hidden时,如何访问DIV中显示的实际文本?

我不认为你所要求的是用javascript做得到的。

编辑:

看看 this 获取自动CSS省略号。这里有一些注意事项,它看起来非常特定于浏览器,但这是另一种做你想做的事情的方法。

本网站介绍了一种可能有助于获取文本显示部分的技术。我不确定这个方法有多准确,但我怀疑它会让你非常接近你想要的: http://www.ruzee.com/blog/2007/08/ellipsis-or-truncate-with-dots-via-javascript

下面是使用jQuery的一个快速想法:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript">
$(function(){
    var innerText = $('#someContent').text();
    var textArray = innerText.split('');
    var formatted = '';
    for(var i in textArray) {
        formatted += '<span>' + textArray[i] + '</span>';
    }
    var heightOfContainer = $('#someContent').height();
    $('#someContent').html(formatted);
    var clipped = '';
    $('#someContent span').each(function(){
        if ($(this).position().top < heightOfContainer) {
            clipped += $(this).text();
        } else {
            return false;
        }
    });
    clipped += '...';
    $('#someContent').html(clipped);
});
</script>

做这件事没有简单的方法。您必须根据DIV大小、字体大小、字体类型和DIV内的文本偏移量来计算DIV中可以看到多少文本。请记住,您可以使用负偏移量来显示文本的不同部分。

您应该能够根据所有这些数字计算出DIV可以容纳多少文本的算法,但由于换行,这有点棘手。

text-overflow 属性,并将其值设置为“省略号”。你看到了吗 documentation here .

如果你想在多行之后得到它,那么 advise this guide .

您可以根据客户端的字符数执行相同的截断。将被截断的部分存储在其他DOM元素中(如果您不介意的话,也可以存储您自己的属性)。将整个过程设置为在body.onLoad()上启动。