get-multiline-text v0.2.3

多行文本省略 + 标签

优点：体积小，0依赖

未来工作

• source map 上传

使用案例

使用方法

HTML

<style>
  #demo1 {
    width: 180px;
    max-height: 66px;
    overflow: hidden;
    background-color: blanchedalmond;
    /* 不论是内联还是class形式 line-height 都必须显示的注明在最外层的容器上 */
    line-height: 22px;
  }

  .tag {
    padding: 0 2px;
    font-size: 14px;
    background-color: chartreuse;
  }
</style>
<div id="demo1">
  <span id="text1"></span>
  <span class="tag">标签</span>
</div>
<script>
  // TIPS: 赋值的时候禁用innerText，innerText会把 \n 转化为<br>标签
  var text = '这是一段只要两行的测试文案';
  text1.append(text);
  var c = window.getMultilineText({ dom: demo1, text, maxHeight: 66, tailPlaceHolder: 32, ellipsis: true });
  text1.innerHTML = '';
  text1.append(c);
</script>