如何将数组取值拼接进字符串，实现原生JS设置body背景图功能

你代码里有两处需要调整：

• 事件绑定错误：window.onload = choosePicture() 加了括号会立即执行函数，不会等到页面加载完成触发，去掉括号改为window.onload = choosePicture即可。
• 背景样式赋值错误：你直接把变量写在字符串引号里，JS不会解析变量值，同时背景图片需要用url()包裹路径，支持两种写法：
  1. 普通字符串拼接：document.body.style.background = "url(" + randPics[randNumGen] + ")";
  2. 模板字符串（ES6+支持，写法更简洁）：document.body.style.background = url(${randPics[randNumGen]});

修改后的完整JS代码如下：

const randPics = ["https://i.ibb.co/6JBbMYm/pic1.jpg", "https://i.ibb.co/rHjTdfc/pic2.jpg"];

window.onload = choosePicture;

function choosePicture() {
  let randNumGen = Math.floor(Math.random() * randPics.length);
  console.log(randNumGen);
  // 普通字符串拼接写法，和下方模板字符串写法二选一即可
  document.body.style.background = "url(" + randPics[randNumGen] + ")";
  // 模板字符串写法
  // document.body.style.background = `url(${randPics[randNumGen]})`;
  // 若需要同时给页面里的img元素赋值，可补充下面这行
  // document.getElementById("pic").src = randPics[randNumGen];
}

如果需要设置背景图不重复、铺满页面等效果，可以直接拼接对应的样式属性，示例如下：

document.body.style.background = "url(" + randPics[randNumGen] + ") no-repeat center / cover";

内容的提问来源于stack exchange，提问作者user16671114