怎么用js设置img标记的src

JavaScript013

怎么用js设置img标记的src,第1张

用setAtrribute()方法

举个例子

<!DOCTYPE html>

<html lang="en">

<head>

  <meta charset="UTF-8">

  <title>Document</title>

</head>

<body>

<img src="1.jpg" alt="">

  <script>

  //获取到图片标签标签

  var img = document.getElementsByTagName("img")[0]

  //设置图片路径

  img.setAttribute("src","2.jpg")

  </script>

</body>

</html>

业务:采购业务流程中当财务人员打款后需要将打款流水图片上传到ftp服务器上。可是有时会上传出错。所以这里需要一个修改的图片的按钮。问题:当img的src的URL地址与之前相同(只更改图片,名称不变,不同图片相同名称)时,结果图片不变化,还是之前的图片。但通过chrome调试发现图片确实是变化的。那造成这个问题的原因时什么呢?方法:只需要每次刷新图片时,在img的src地址后面拼接一个随机数即可。例子:原有图片地址:<img src="http://img.boredou.com/1234556788.jpg" /> 修改后图片地址:<img src="http://img.boredou.com/1234556788.jpg?23333333" /> 原理:经过在浏览起端调试,发现当src的地址不变时,浏览器会从缓存里面取出来。而浏览器缓存的还是之前的图片。所以图片不会变化。 而当img的src中拼接了随机参数,那么浏览器会认为这是一张新的图片(或者说访问了不同的路径),浏览器每次访问都会访问服务器,而不会访问缓存里数据。

js文件不是htm文件,所以里面不能有html标记(在输出语句中包含的html标记除外)。

即使js文件中可以用<script>标记,由于js文件本身就是由<script src="...">标记调用的,这就变成重复标记了,是画蛇添足了。

js属于脚本文件,是由脚本代码组成的。其实把正常的<script>与</script>标记之间的代码剪切到新文件中就是一个js文件了,然后把文件名放到script的src属性就行了。

扩展资料:

JavaScript语言中采用的是弱类型的变量类型,对使用的数据类型未做出严格的要求,是基于Java基本语句和控制的脚本语言,其设计简单紧凑。

JavaScript是一种采用事件驱动的脚本语言,它不需要经过Web服务器就可以对用户的输入做出响应。在访问一个网页时,鼠标在网页中进行鼠标点击或上下移、窗口移动等操作JavaScript都可直接对这些事件给出相应的响应。

JavaScript脚本语言不依赖于操作系统,仅需要浏览器的支持。因此一个JavaScript脚本在编写后可以带到任意机器上使用,前提上机器上的浏览器支 持JavaScript脚本语言,JavaScript已被大多数的浏览器所支持。

参考资料来源:百度百科-JavaScript