计算DIV中适合的字符数

Question

我的页面上有一个DIV(这是一个响应式设计),它只包含一组pt大小的文本.文字很合适,页面看起来很棒.

但是,当浏览器缩小尺寸时,DIV会缩小,并且我的一些文本会从DIV中消失.

是否有某种JavaScript(jQuery)公式可以计算出DIV中可以容纳多少个字符？我的想法是每次浏览器改变大小,文本被截断,并在末尾添加省略号.我只是不知道在哪里截断它.

谢谢

Answer 1

你试过css吗？

div.resizable {
    overflow-x: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

计算字符的空间需求将产生一个庞大的原始数据表.用户代理,字体系列/大小/重量/品种和符号是要考虑的维度.

虽然嵌入带有包含html数据的foreignObject节点的svg元素可能是一条可行的路径,但我认为很难从现场上下文中收集数据:可以将文本复制到foreignObject元素中并使用该getBBox方法来提供声称空间.

警告:后一种想法刚刚从我生病的心灵中产生,我没有实施这样的计划.