阅读量:0
可以通过JavaScript来实现动态更换背景图片。你可以通过获取要更换的背景图片的URL，并将其设置为元素的background-image样式来实现。下面是一个简单的示例代码：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Dynamic Background Image</title> <style> body { background-image: url('original-background.jpg'); background-size: cover; background-repeat: no-repeat; height: 100vh; margin: 0; display: flex; justify-content: center; align-items: center; } </style> </head> <body> <button onclick="changeBackground()">Change Background</button> <script> function changeBackground() { const newBackgroundUrl = 'new-background.jpg'; document.body.style.backgroundImage = `url(${newBackgroundUrl})`; } </script> </body> </html> 在上面的示例中，我们通过点击按钮调用changeBackground函数来更改背景图片。在函数中，我们将新的背景图片的URL赋给newBackgroundUrl变量，并将其设置为body元素的background-image样式。这样就实现了动态更换背景图片的效果。
