javascript 文本不显示在HTML文件.脚本标签可能使文本消失？

kkih6yb8 于 5个月前发布在 Java

关注(0)|答案(2)|浏览(70)

我试图弄清楚如何让HTML选择一个新的随机图像文件每次页面被重新加载，我确实设法弄清楚了，但我的问题是，现在没有一个文本显示在所有我想要的，唯一显示的是图像.奇怪的是，任何在样式标签工作.
我假设它与脚本标签有关，因为当我删除它时，文本显示得很好。我只是想让文本显示在图像的上方和下方。
请帮助和感谢。我也是新的HTML。

HTML格式

<!DOCTYPE html>
<html lang="en">

<body>
    Hello World <br>
</body> 
<br>

<body id ="img"  style ="border: 2px solid #6b1148;">
    <script src="rand.js"></script> <br>  
</body> 
<br>

<body>
    Goodbye World <br>
</body> 

</html>

字符串

JavaScript

var images = [
  '1.png',
  '2.png',
  '3.png',
]

var img = document.getElementById("img");

function imgDisp(num) {
  var num = Math.floor(Math.random() * 3);
  img.style.content = 'url("' + images[num] +'")';

}
imgDisp();

型
我试着删除脚本行和文本显示罚款，但当然不是解决方案，因为我仍然希望的形象。

JavaScript

来源：https://stackoverflow.com/questions/77743820/text-not-showing-in-html-file-script-tag-possibly-making-text-disappear

2条答案

按热度按时间

91zkwejq1#

当浏览器解析你的html代码时，注意只有一个body元素。你可以通过按Ctrl+Shift+I并检查元素来检查这一点。
您无法看到图像上方和下方的文本的原因是因为在rand.js文件中，您正在更改整个body元素的样式，从而将您编写的所有内容替换为随机图像。
另外，请确保在body的末尾有脚本标记。
看看我从你那里写的这个片段：

var images = [
  'https://i.pinimg.com/474x/0e/f5/49/0ef5497a58c2ba5900ffa8a4656ed0a8.jpg',
  'https://i.pinimg.com/564x/3a/6b/b7/3a6bb70331903da7f58d9a6e7a6a5b2e.jpg',
  'https://avatarfiles.alphacoders.com/335/335293.png'
]
  
  var img = document.getElementById("img");
  
  function imgDisp(num) {
    var num = Math.floor(Math.random() * 3);
    img.style.content = 'url("' + images[num] +'")';
 
  }
  imgDisp();

个字符

赞(0）回复(0）举报 5个月前

4urapxun2#

我猜你想用你的脚本改变正文的背景图片，所以我把'style.content'的属性改成了'style. backgroundImage'。
我重写了你的HTML，因为在一个HTML文件中不能有多个标签。
标签，代表“段落”，我们使用这个标签在HTML文件中写入简单的文本。

HTML：

<!DOCTYPE html>
<html lang="en">

<body id="img" style="border: 2px solid #6b1148;">
    <script src="rand.js"></script> 

    <p>Hello World</p>
    <br>

    <p>Goodbye World </p>
    <br>

</body> 

</html>

字符串

JS：

var images = [
    '1.png',
    '2.png',
    '3.png',
]
  
var img = document.getElementById("img");
  
function imgDisp(num) {
  var num = Math.floor(Math.random() * 3);
  img.style.backgroundImage = 'url("' + images[num] +'")';
  
}
imgDisp();

型
我希望我能帮助你兄弟！新年快乐！HTML和JS是一个很好的方式开始学习代码，你会在一个很好的道路。对不起，如果有任何英语错误在这，我是一个巴西人试图帮助哈哈。

赞(0）回复(0）举报 5个月前

我来回答

javascript 文本不显示在HTML文件.脚本标签可能使文本消失？

2条答案

相关问题

热门标签

最新问答