如何在 html 中顯示來自 Javascript 數組的隨機引用？

Question

我試圖讓數組中列出的隨機引號出現在我的網站上重新加載但是我不能讓它工作

Javascript：

function textOfToday() {
    
    var textOfTodayArray = [
        'String 1', 'String 2'
    ]

document.getElementById('randomTitle').value = textOfTodayArray[Math.floor(Math.random()*textOfTodayArray.length)];
}

以下 html div 代碼旨在顯示文本，但我無法得到它：

<div class="randomTitle" style="text-align: center;"></div>

我也嘗試在 div 部分使用id="randomTitle"但這也不起作用

可能還有其他問題嗎？ 我絕對不是專家，但我無法發現任何語法錯誤

任何幫助，將不勝感激

Answer 1

確保在您的 js textOfToday()中調用該函數。 您正在定義它，但從不調用。

另外，是的，如果要使用getElementById ，則需要將class更改為id 。

最后，您需要設置innerText而不是value

Answer 2

document.querySelector('.foo').value主要用於<input> ，以在 div 或任何元素中顯示信息，您最好使用innerText或innerHTML

 function textOfToday() { var textOfTodayArray = [ 'String 1', 'String 2' ] document.getElementById('randomTitle').innerText = textOfTodayArray[Math.floor(Math.random()*textOfTodayArray.length)]; } textOfToday()

 <div id="randomTitle" style="text-align: center;"></div>

Answer 3

您需要使用innerHTML屬性在 HTML 元素中顯示。 當您按 Id 定位時，還要使用 id 標簽。 此外，您從未調用過您的函數，因此它從未運行過。

 function textOfToday() { var textOfTodayArray = ['String 1', 'String 2']; document.getElementById('randomTitle').innerHTML = textOfTodayArray[Math.floor(Math.random() * textOfTodayArray.length)]; } textOfToday();

 <div id="randomTitle" style="text-align: center;">Hi</div>