JS中改变<img>的src,不正确的解决办法:在改变之后的src后面加上“Date()”。
例:
<img src="images/image01.jpg" id="myImage" />然后改变时,使用js脚本:
document.getElementById('myImage')。src='images/image02.jpg‘ + Date();通过找到img这个元素,然后再找到这个元素里的src属性,就可以查看,更改这个属性了
1)原生js
元素.setAttribute() //增加,更改属性,有两个参数,第一个参数是属性名,第二个是值.
元素.getAttribute() //传入属性名,获得该属性对应的值
2)Jquery(需要导包)
元素.attr()//可传两个参数,传一个为获取该属性的值,传两个位增加 或 更改这个属性.
举个例子:
<!doctype html><html lang="en">
<head>
<meta charset="UTF-8">
</head>
<body>
<img src="6.jpg">
<script src="jquery-2.1.1.min.js"></script>
<script>
//原生js
document.getElementsByTagName('img')[0].setAttribute('name','myimg')//没'name'属性,添加'name'属性,值为'myimg'
document.getElementsByTagName('img')[0].setAttribute('src','7.jpg')//以有'src'属性,更改值为'7.jpg',达到换图片的目的
document.getElementsByTagName('img')[0].getAttribute('src')//返回'src'的值,'7.jpg'
//Jquery
$('img').attr('src','6.jpg')//把src属性更改为'6.jpg'
$('img').attr('src')//获得src属性为'6.jpg'
</script>
</body>
</html>
<html><head>
<script type="text/javascript" src="scripts/jquery.1.8.2.min.js"></script>
<title></title>
<script type="text/javascript">
function changeSrc() {
document.getElementById("myImage").src = "image/5.gif"
// alert(0)
}
</script>
</head>
<body>
<img id="myImage" src="image/1.gif" />
<table id="qqstab"><tr><td><img src="image/1.gif"></td></tr></table>
<button id="myImage" onclick="changeSrc()">点击</button>
</body>
</html>