使用 JavaScript 计算文章的预计阅读时间

你可能在 Medium 等网站上看到过预估阅读时间。这个指标可以帮助用户决定是立即阅读文章，还是保存起来稍后再读。在本教程中，我们将使用 JavaScript 计算文章的预估阅读时间。

首先，让我们在 HTML 文档中创建一个虚拟文章，如下所示：

<article id="article">
  <h1>Lorem ipsum dolor sit amet</h1>
  <p>
    Minus ullam est commodi facere repudiandae sit. Ab quibusdam totam
    veniam ducimus ut consequatur sit. Ea et nulla quaerat. Et temporibus
    quas numquam quas dolor vero accusantium numquam.
  </p>
  <!-- repeat <p> tag several times here -->
</article>

然后在您希望在页面中显示阅读时间的位置添加以下内容：

<p><span id="time"></span> minute read</p>

现在使用 JavaScript 函数来计算阅读时间：

function readingTime() {
  const text = document.getElementById("article").innerText;
  const wpm = 225;
  const words = text.trim().split(/\s+/).length;
  const time = Math.ceil(words / wpm);
  document.getElementById("time").innerText = time;
}
readingTime();

以下是该readingTime()函数的具体功能：

text– 获取文章文本，以便我们可以进行计算。
wpm– 成年人平均阅读速度（每分钟字数）。
words– 通过在每个空格处进行分割来计算单词总数（长度）。
time– 计算读取时间并四舍五入到最接近的整数。

计算出时间后，我们将数字输出到<span id="time"></span>。

本教程到此结束，您现在知道如何显示可以轻松放入博客或新闻网站的文章的预计阅读时间。

链接阅读时间：https://dev.to/michaelburrows/calculate-the-estimated-reading-time-of-an-article-using-javascript-2k9l