html 获取 <div class="avatar"></div> 动态更改此元素的背景图片
时间: 2023-10-07 13:03:58 浏览: 112
vue动态改变背景图片demo分享
你可以使用 JavaScript 来获取到该元素,并且更改其背景图片。具体的做法如下:
```html
<!-- HTML 代码 -->
<div class="avatar"></div>
```
```javascript
// JavaScript 代码
const avatar = document.querySelector('.avatar'); // 获取元素
avatar.style.backgroundImage = 'url(图片地址)'; // 更改背景图片
```
其中,`querySelector` 方法可以根据 CSS 选择器获取到匹配的第一个元素,`style` 属性可以获取或设置元素的样式,`backgroundImage` 属性可以设置元素的背景图片。你只需要将上述代码中的“图片地址”替换成你想要设置的图片地址即可。
注意:在设置背景图片时,要将图片地址放在 `url()` 中。同时,如果图片地址是相对路径,则相对路径的起点是 HTML 文件所在的目录。
阅读全文