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

动态给div标签指定一张图片, 利用jquery是比力便利的, 本文介绍两种体例:
1)设置div的布景图
2)div内部插入一个图片标签

需要这些哦
visual studio code
方式/
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标签指定一张图片】在浏览器中运行, 结果如下

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




以上内容就是如何动态给div标签指定一张图片的内容啦, 希望对你有所帮助哦!

    猜你喜欢