JavaScriptの.lengthで読了までの時間と文字数をカウントして表示

elements.innerHTML.length;

for (let i = 0; i < data.length; i++) {
  viewPosts.innerHTML += data[i].date
}

<ul id="postpoint"></ul>
<p class="dummyTitle"><span>ダミーの記事</span></p>
<p id="countPost">日本国民は正当に選挙された国会における代表者を通じて行動し、われらとわれらの子孫のために、諸国民と協和による成果と、わが国全土にわたって自由のもたらす恵沢を確保し、政府の行為によって再び戦争の惨禍が起こることのないようにすることを決意し、ここに主権が国民に存することを宣言し、この憲法を確定する。そもそも国政は国民の厳粛な信託によるものであって、その権威は国民に由来し、その権力は国民の代表者がこれを行使し、その福利は国民がこれを享受する。これは人類普遍の原理であり、この憲法は、かかる原理に基づくものである。われらはこれに反する一切の憲法、法令及び詔勅を排除する。日本国民は正当に選挙された国会における代表者を通じて行動し、われらとわれらの子孫のために、諸国民と協和による成果と、わが国全土にわたって自由のもたらす恵沢を確保し、政府の行為によって再び戦争の惨禍が起こることのないようにすることを決意し、ここに主権が国民に存することを宣言し、この憲法を確定する。そもそも国政は国民の厳粛な信託によるものであって、その権威は国民に由来し、その権力は国民の代表者がこれを行使し、その福利は国民がこれを享受する。これは人類普遍の原理であり、この憲法は、かかる原理に基づくものである。われらはこれに反する一切の憲法、法令及び詔勅を排除する。日本国民は正当に選挙された国会における代表者を通じて行動し、われらとわれらの子孫のために、諸国民と協和による成果と、わが国全土にわたって自由のもたらす恵沢を確保し、政府の行為によって再び戦争の惨禍が起こることのないようにすることを決意し、ここに主権が国民に存することを宣言し、この憲法を確定する。そもそも国政は国民の厳粛な信託によるものであって、その権威は国民に由来し、その権力は国民の代表者がこれを行使し、その福利は国民がこれを享受する。これは人類普遍の原理日本国民は正当に選挙された国会における代表者を通じて行動し、われらとわれらの子孫のために、諸国民と協和による成果と、わが国全土にわたって自由のもたらす恵沢を確保し、政府の行為によって再び戦争の惨禍が起こることのないようにすることを決意し、ここに主権が国民に存することを宣言し、この憲法を確定する。そもそも国政は国民の厳粛な信託によるものであって、その権威は国民に由来し、その権力は国民の代表者がこれを行使し、その福利は国民がこれを享受する。これは人類普遍の原理であり、この憲法は、かかる原理に基づくものである。われらはこれに反する一切の憲法、法令及び詔勅を排除する。日本国民は正当に選挙された国会における代表者を通じて行動し、われらとわれらの子孫のために、諸国民と協和による成果と、わが国全土にわたって自由のもたらす恵沢を確保し、政府の行為によって再び戦争の惨禍が起こることのないようにすることを決意し、ここに主権が国民に存することを宣言し、この憲法を確定する。そもそも国政は国民の厳粛な信託によるものであって、その権威は国民に由来し、その権力は国民の代表者がこれを行使し、その福利は国民がこれを享受する。これは人類普遍の原理であり、この憲法は、かかる原理に基づくものである。われらはこれに反する一切の憲法、法令及び詔勅を排除する。日本国民は正当に選挙された国会における代表者を通じて行動し、われらとわれらの子孫のために、諸国民と協和による成果と、わが国全土にわたって自由のもたらす恵沢を確保し、政府の行為によって再び戦争の惨禍が起こることのないようにすることを決意し、ここに主権が国民に存することを宣言し、この憲法を確定する。そもそも国政は国民の厳粛な信託によるものであって、その権威は国民に由来し、その権力は国民の代表者がこれを行使し、その福利は国民がこれを享受する。</p>

document.addEventListener('DOMContentLoaded', function() {
  const MINUTE_READ_CHAR = 500; // 500文字＝1分でカウント 
  var getElm       = document.getElementById('countPost'); // 出力させる要素
  var putElm       = document.getElementById('postpoint'); // カウントする要素
  var strNoHtmlTag = '';
  var iReadTime    = '';
  var strSetHtml   = '';
  var textCount      = getElm.innerHTML.length; // 文字数のカウント
  
  if(getElm != null){
    // 文字列の抜き出し
    strNoHtmlTag = getElm.innerHTML.replace(/<("[^"]*"|'[^']*'|[^'">])*>/g,'');
    // 文字数を秒数でカウント
    iReadTime = Math.floor( strNoHtmlTag.length / MINUTE_READ_CHAR );
    if( iReadTime == 0 ){
      // 1分未満は1分に変更
      iReadTime = 1;
    }
    // タグ作成
    strSetHtml = '<li class="readAllTime">この記事は<span>約' + iReadTime + '分</span>で読めます。</li>';
    textDis = '<li class="textCount">以下の文章は<span>' + textCount + '</span>文字です。</li>';
    // タグ埋め込み
    putElm.innerHTML= putElm.innerHTML + strSetHtml;
    putElm.innerHTML= putElm.innerHTML + textDis;
  }
});

/* 読む時間と文字数 */
ul#postpoint {
    list-style: none;
    padding: 0;
    border: none;
    margin: 0 0 25px;
}
ul#postpoint li {
    padding-left: 25px;
    position: relative;
}
ul#postpoint li:before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: 1em;
    position: absolute;
    left: 0;
    width: 20px;
    text-align: center;
    line-height: 2.6;
}
ul#postpoint li span {
    font-weight: 600;
    font-size: 1.4rem;
    padding-left: 3px;
    padding-right: 3px;
    letter-spacing: 0.02rem;
}
/* アイコンはFontawesome */
li.readAllTime:before {
    content: "\f252";
}
li.textCount:before {
    content: "\f891";
}

/* 文字数を取得する要素 */
p#countPost {
    max-height: 400px;
    overflow-y: scroll;
    margin: 0;
    border: solid 2px #ddd;
    padding: 20px 25px;
    background: #FFF;
    border-radius: 0 0 3px 3px;
}
p.dummyTitle {
    background: #dddddd;
    text-align: center;
    color: #313131;
    margin: 0;
    padding: 15px 0 12px;
    font-size: 1.3rem;
    font-weight: 500;
    letter-spacing: 0.05rem;
    position: relative;
    border-radius: 3px 3px 0 0;
}
/* スクロールバー */
p#countPost::-webkit-scrollbar {
    width: 12px;
}
p#countPost::-webkit-scrollbar-thumb {
    background: #313131;
    border-radius: 9999px;
}