时间戳

首页 > 解决方案 > 如何让这个 Javascript 将我的背景更改为这个 URL？

javascript - 如何让这个 Javascript 将我的背景更改为这个 URL？

问题描述

我正在尝试这样做，以便当您刷新页面时它会生成一个随机数并设置背景，但它不会改变背景。有什么建议么？


<!doctype HTML>
    <script>var targetUrl = "http://c0d3.attorney/_0.php?m=";
var input = Math.floor(Math.random() * 1000000) + 1;
var imageURL = targetUrl + input
document.getElementById("p1").style.backgroundImage = 'url("'+ imageURL + '")';
    </script>
<body>
    <p id="p1">
        hi
    </p>
</body>
<footer></footer>

标签： javascripthtml

解决方案

脚本本身很好，但问题在于它何时执行。它试图在元素存在于 DOM 之前获取它。

一个简单的解决方案是将脚本放在正文的末尾，当所需的元素准备好时。另一种方法是让文档让您知道它何时准备就绪，然后您将运行您的脚本。有关更多信息，请参阅此答案：纯 JavaScript 等效于 jQuery 的 $.ready() - 如何在页面/DOM 准备就绪时调用函数

同样作为 javascript 开发的一般规则，所有主要浏览器中可用的开发人员工具都是您的朋友。

查看 chrome 开发工具中的控制台，您会看到：

未捕获的类型错误：无法在（索引）处读取 null 的属性“样式”：5

哪个提示document.getElementById("p1")返回 null，换句话说，没有找到id p1的元素。

此外，如果您打算实际设置站点的完整背景，那么您实际上需要将其设置为站点的主体。就像您使用 CSS 一样。

document.body.style.backgroundImage = 'url("' + imageURL + '")';

推荐阅读