js动态改变元素属性img标签的src
Posted Sandrawyy
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了js动态改变元素属性img标签的src相关的知识,希望对你有一定的参考价值。
<head>
<title>
just a test!
</title>
<script type="text/javascript">
/**
* function:when you open the page,get user‘s data from database
*/
function set_follow(){
var count=0;// you should read it from database
document.getElementById("follow_count").innerhtml=count;
}
/**
* function:change the state of follow
* @return {[type]} [description]
*/
function change_follow(){
var follow=document.getElementById("follow");
var follow_count=document.getElementById("follow_count")
var follow_src_path=follow.src;
follow_src_name=follow_src_path.split("/");
if(follow_src_name[follow_src_name.length-1]=="icon_like.png"){//if you dislike it,set "unlike" and follow_count--
follow.src="icon_unlike.png";
follow_count.innerHTML--;
}
else{//if you like it,set "like" and follow_count++
follow.src="icon_like.png";
follow_count.innerHTML++;
}
}
</script>
</head>
<body>
<div onload="set_follow()">
<ul>
<li><img src="icon_unlike.png" id="follow" onclick="change_follow()">
</img></li>
<li id="follow_count">0</li>
</ul>
</div>
</body>
以上是关于js动态改变元素属性img标签的src的主要内容,如果未能解决你的问题,请参考以下文章
用js动态的改变img标签里面的src属性实现图片的循环切换
js 动态添加元素(div、li、img等)及设置属性的方法