当前位置: 首页 > 编程笔记 >

JS动态修改图片的URL(src)的方法

牛嘉谊
2023-03-14
本文向大家介绍JS动态修改图片的URL(src)的方法,包括了JS动态修改图片的URL(src)的方法的使用技巧和注意事项,需要的朋友参考一下

本文实例讲述了JS动态修改图片的URL(src)的方法。分享给大家供大家参考。具体如下:

下面的JS代码可以动态修改图片地址,以显示一张新的图片,实际上是通过修改图片的src属性来实现的

<!DOCTYPE html>
<html>
<head>
<script>
function changeSrc()
{
document.getElementById("myImage").src="hackanm.gif";
}
</script>
</head>
<body>
<img id="myImage" src="compman.gif" width="107" height="98">
<br><br>
<input type="button" onclick="changeSrc()" value="Change image">
<p><b>Note:</b> The src property can be changed at any time. 
However, the new image inherits the height and width
attributes of the original image,
if not new height and width properties are specified.</p>
</body>
</html>

希望本文所述对大家的javascript程序设计有所帮助。

 类似资料:
  • 本文向大家介绍JS来动态的修改url实现对url的增删查改,包括了JS来动态的修改url实现对url的增删查改的使用技巧和注意事项,需要的朋友参考一下 虽然可以通过get方式提交post表单等方式来动态修改url,但如果多个按钮能并行提交时,写多个大体相同,又有些细节差异的表单,难免有些不妥,因此,想到了通过JS来动态的修改url,来实现对url的增删查改。

  • 本文向大家介绍js动态切换图片的方法,包括了js动态切换图片的方法的使用技巧和注意事项,需要的朋友参考一下 本文实例讲述了js动态切换图片的方法。分享给大家供大家参考。具体实现方法如下: index.css文件如下: index.html如下: 希望本文所述对大家的javascript程序设计有所帮助。

  • 本文向大家介绍JS使用oumousemove和oumouseout动态改变图片显示的方法,包括了JS使用oumousemove和oumouseout动态改变图片显示的方法的使用技巧和注意事项,需要的朋友参考一下 本文实例讲述了JS使用oumousemove和oumouseout动态改变图片显示的方法。分享给大家供大家参考。具体如下: 鼠标放到图片上时图片会自动变大,鼠标离开图片还原 希望本文所述对

  • 本文向大家介绍js改变Iframe中Src的方法,包括了js改变Iframe中Src的方法的使用技巧和注意事项,需要的朋友参考一下 本文实例讲述了js改变Iframe中Src的方法。分享给大家供大家参考。具体实现方法如下: 希望本文所述对大家的javascript程序设计有所帮助。

  • 本文向大家介绍JS动态图片的实现方法完整示例,包括了JS动态图片的实现方法完整示例的使用技巧和注意事项,需要的朋友参考一下 本文实例讲述了JS动态图片的实现方法。分享给大家供大家参考,具体如下: 运行效果: 感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具:http://tools.jb51.net/code/HtmlJsRun测试上述代码运行效果。 更多关于JavaSc

  • 本文向大家介绍js正则匹配出所有图片及图片地址src的方法,包括了js正则匹配出所有图片及图片地址src的方法的使用技巧和注意事项,需要的朋友参考一下 本文实例讲述了js正则匹配出所有图片及图片地址src的方法。分享给大家供大家参考。具体分析如下: 有很多时候我们需要用到文章里面的图片,而且主要是用到它的图片地址,这个时候我们需要通过正则匹配出图片标签,然后做到我们需要的数据 平时也没怎么用正则,