我正在制作一个其中某些文本块将随机不可见的应用。我正在使用以下代码使某些文本消失
我的HTML将如下所示:
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
<span>Hello. My name is Tom </span>
<span>And I like to play video games </span>
<span>But I am too old to be goofing around </span>
</body>
</html>
和Javascript:
document.addEventListener("DOMContentLoaded", function(event) {
for (var i = 0; i < document.querySelectorAll("span").length; i++ ){
var hiddenProbability = Math.floor(Math.random() * 100 ) + 1;
if(hiddenProbability <= 50) {
document.querySelectorAll("span")[i].style.visibility = "hidden";
}
}
});
一旦我将房子悬停在它们上方,如何使跨度范围内的看不见的单词块变得可见。我尝试使用CSS(可见性:visible),但是没有生效。
您的JavaScript是否正在运行?如果我对问题的理解正确,听起来您只是在添加一个事件监听器,该事件监听器在页面内容首次加载时发生(取决于您的脚本在html中的位置,它可能会触发也可能不会触发)。] >
如果您希望他们对鼠标事件做出反应,则需要根据实际需要使用onmouseover(或onmouseenter)。
https://www.w3schools.com/jsref/event_onmouseover.asp
如果只是在页面首次加载时发生,那么您可能只需要修改事件侦听器。Code inside DOMContentLoaded event not working