问题描述
在使用js获取div下的p标签并改变其显示的值时，使用getElementsByClassName()方法无法改变其中的值。
HTML代码如下：
<body>
<div class="screen">
<p id="present" class="show">即将开始</p>
</div>
<button id="1" onclick="start()">开始</button>
<button id="2" onclick="end()">结束</button>
</body>
js代码如图所示：
function start() {
var index=parseInt(Math.random()*10);
console.log(index); //打印检查是否获得随机数值
document.getElementsByClassName("show").innerHTML=index;
}
效果如图所示：
点击“开始”后我们可以看到打印出了获得的随机数“5”，但p标签中的文字还是“即将开始”，并没有改变成随机数“5”
解决方法
经笔者实验，使用getElementById()方法获取p标签并用innerHTML方法改变其中的值就可以了。
js代码如下：
function start() {
var index=parseInt(Math.random()*10);
console.log(index);
document.getElementById("present").innerHTML=index;
}
代码运行结果：
这时候我们可以看到，p中的内容已经变成我们想要的随机数啦。
后言
其中原因，笔者也暂不清楚，但会继续查资料学习，若有读者知道，也可以在评论区讨论。
扫一扫
2471
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
