js如何改变div的背景图片

 时间:2024-10-11 19:26:11

1、新建一个html文件,命名为test.html,用于讲解js如何改变div的背景图片。

js如何改变div的背景图片

2、在test.html文件内,创建一个div模块,设置其class属性为bg,id属性为mydiv,用于下面设置css样式和获取div对象。

js如何改变div的背景图片

3、在test.html文件内,使用css设置div的样式,设置其宽度为500px,高度为272px,背景图片为2.jpg。

js如何改变div的背景图片

4、在test.html文件内,在div的下面创建一个button按钮,按钮名称为“更换背景”。

js如何改变div的背景图片

5、给button按钮绑定onclick点击事件,当按钮被点击时,执行myfun()函数。

js如何改变div的背景图片

6、在test.html文件内,在js标签内,创建myfun()函数,在函数内,使用getElementById()方法通过id获得div对象,设置对象中的backgroundImage背景属性为另一张图片,从而实现改变div的背景图片。

js如何改变div的背景图片

7、在浏览器打开test.html文件,点击按钮,查看实现的效果。

js如何改变div的背景图片js如何改变div的背景图片
  • 如何在HTML中插入图片
  • html背景图片自适应屏幕大小
  • html如何把两个网页连接起来
  • HTML页面如何给图片添加链接
  • HTML怎么实现网页跳转
  • 热门搜索
    胡萝卜炒肉的做法 饬怎么读 川贝炖雪梨的正确做法 河南胡辣汤的做法 西米粽子的做法和包法 电脑怎么下载软件 山药的吃法与做法 猪肝瘦肉粥的做法 饺子馅怎么调好吃 南瓜小米粥的做法