document.getElementById("modifly_page").src

最新推荐文章于 2025-03-14 16:43:10 发布

原创最新推荐文章于 2025-03-14 16:43:10 发布 · 3.3k 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#js #ViewUI

JaveScript 专栏收录该内容

19 篇文章

订阅专栏

本文介绍了一种使用JavaScript动态更改HTML中图片源的方法。通过获取指定ID的元素并修改其src属性，实现图片的切换效果。该技巧适用于网页交互设计。

document.getElementById("modifly_page").src = "";

释义：设置ID为modifly_page的html标签的src属性""里面为值



例子： 动态改变图片
<html>
	<head>
		<title>Src Test!</title>
		<meta http-equiv="content-type" content="text/html; charset=UTF-8">
		<script type="text/javascript">
			function bImg(){
				var src = document.getElementById("imgbutton").src;
				
				var index = document.getElementById("imgbutton").src.lastIndexOf("/");
				
				var fileName = src.substr(index + 1)
				
				fileName == "psbe.jpg" ? (document.getElementById("imgbutton").src="psbed.jpg") : (document.getElementById("imgbutton").src="psbe.jpg")
			}
		</script>
	</head>

	<body>
		<img id="imgbutton" src="psbe.jpg" onClick="bImg(imgbutton)" />
	</body>
</html>