如何在 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>