如何在具有可调整大小的元素的截断文本中实现省略号？

在截断的文本中插入省略号

要在可调整大小的元素内的文本中间实现省略号，请考虑以下方法：

第 1 步：数据属性声明

在 HTML 中，在自定义 data-* 属性中包含全文，例如：

第 2 步：事件监听器

分配用于加载和调整大小为 JavaScript 函数的事件监听器。

第 3 步：省略号函数

利用以下 JavaScript 函数来处理省略号插入：

<code class="javascript">function start_and_end(str) {
  if (str.length > 35) {
    return str.substr(0, 20) + '...' + str.substr(str.length - 10, str.length);
  }
  return str;
}</code>

根据不同的截断调整值（例如 20 和 10）。

第 4 步：InnerHTML 插入

在事件监听函数中，读取原始数据属性并将其放置在span标签的innerHTML中：

<code class="javascript">mySpan.innerHTML = start_and_end(mySpan.getAttribute("data-original"));</code>

第5步：工具提示（可选）

为用户提供完整字符串的工具提示，添加一个带有 title 属性的 abbr 标签：

以上是如何在具有可调整大小的元素的截断文本中实现省略号？的详细内容。更多信息请关注PHP中文网其他相关文章！