<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>js练习 js是脚本语言直接运行在浏览器上的。</title>
<script type="text/javascript">
function addcontent(){
document.getElementById("span01").innerHTML="<img src=‘pic/star-off.png‘>";
}
</script>
</head>
<body>
<span id="span01">
</span>
<input type="button" value="增加图片" onclick="addcontent();">
</body>
</html>
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>js练习 js是脚本语言直接运行在浏览器上的。</title>
<script type="text/javascript">
function addpic(){
//第一步创建一个dom元素
var imgdom=document.createElement("img");
//第二步引用方法
imgdom.setAttribute("src","pic/star-on.png");
//把元素节点的值给她
document.getElementById("div1").appendChild(imgdom);
}
</script>
</head>
<body>
<div id="div1">
</div>
<input type="button" value="添加" onclick="addpic()">
</body>
</html>
总结:第一种方式添加只能添加一张图片，第二种可以添加很多张图片（先创建dom元素，然后给dom元素赋值，最后添加dom元素到div中去）。
原文：http://www.cnblogs.com/gongxuanming/p/7044734.html