Java Scriptで文章をランダムに表示させたい

Question

前提・実現したいこと

プログラミングの初心者です。（HTML、CSSをざっと勉強し、現在JavaScriptの勉強をしてます。）
以下のようなサイトを作りたいのですが、可能でしょうか。
元データ（CSV、Excel等）に記録されているテキスト（ex.A1〜A300に文章が入力されています）をWebサイトに表示したいです。
具体的には、
・Webページの指定した場所に、元データに記録されているテキストを一つずる表示する。
・表示されるテキストは一定時間ごとにランダムに選ばれる。
可能でしたら、コードも教えていただきたいです。

JavaScriptの勉強がはかどらないため、作りたいものから入ろうと思い、質問させていただきました。
よろしくお願いいたします。

発生している問題・エラーメッセージ

エラーメッセージ

該当のソースコード

ソースコード

試したこと

ここに問題に対して試したことを記載してください。

補足情報（FW/ツールのバージョンなど）

ここにより詳細な情報を記載してください。

Comments

[m.ts10806]

元データとはどこに置かれているのでしょうか。どのように指定するのでしょうか。
今、どこまで出来ているのでしょうか。

> 可能でしたら、コードも教えていただきたいです。
それは質問ではなく作業依頼です。
ネットで落ちているようなことを組み合わせればある程度見えてくるのでは？
何一つ手につかないのでしたら、「やりたいこと」とはいえ、それに手を付ける段階でないとも言えます。コードもらったところで何一つ自分の身にもなりません。

Answer 1

サーバーサイドのプログラムを利用しないなら予めすべての文書を読み込んでおいて
配列に入れ込んで、シャッフルして先頭のデータを表示するのが楽です
テキストは別ファイルにしてajaxで受け取るとよいでしょう

Comments

[yambejp]

//hoge.txt：仮に文書同士の区切りを改行マークとする
aaa
bbb
ccc

//html
<script>
window.addEventListener('DOMContentLoaded',async()=>{
var txts=await fetch('hoge.txt').then(x=>x.text());
txts=txts.split(/[\r\n]+/).map(x=>[x,Math.random()]).sort((x,y)=>x[1]-y[1]).map(x=>x[0]);
document.querySelector('#text').textContent=txts[0];
});
</script>
<div id="text"></div>