如何动态给div标签指定一张图片

 时间:2024-10-14 14:58:04

1、打开visual studio code,新建如下结构的文件,在vs code中的html页面输入一个感叹号,再按一下Tab键,就可以快速创建H5格式的页面DOM结构

如何动态给div标签指定一张图片

2、在页面上添加一个div,设置高=300px,宽=300px。再添加两个按钮,用于后面演示点击按钮时给div添加图片

如何动态给div标签指定一张图片

3、在页面head部分,引入jquery源码,要使用jquery是必须要引入其源文件的

如何动态给div标签指定一张图片

4、在页面添加Jquery代码,绑定【添加背景图】按钮的点击事件,动态给div添加背景图

如何动态给div标签指定一张图片

5、在浏览器中打开页面,点击【添加背景图】,就可以看到图片的效果

如何动态给div标签指定一张图片

6、在页面添加Jquery代码,绑定【添加img标签】按钮的点击事件,动态给div插入一个img标签,显示图片

如何动态给div标签指定一张图片

7、在浏览器中运行,效果如下

如何动态给div标签指定一张图片
  • 如何在html中创建一个进度条
  • jquery如何实现鼠标放上div时改变其大小
  • 怎样设置ul标签中单独的某一项显示不同格式
  • php的session如何使用
  • 在FrontPage中如何使用模板创建个人网站
  • 热门搜索
    米豆腐怎么做好吃 荏苒怎么读 怎么删除word空白页 腰肌劳损怎么锻炼 华为怎么分屏 晕车怎么办 为什么你要伤害一个爱你的人 腊八粥做法 厄怎么读 失业金怎么申请领取