根据一个数组，在页面加载时循环生成相似的元素
<li> <a href="http://reference.XXX.xin/"> <img alt="XXX" src="images/gitbook.png" /> </a> <p> <span>XXX</span> <a href="http://reference.XXX.xin/"></a> </p></li>
js文件中写法
window.onload = function (){ var focus_Box=document.getElementById("ul"); var projectList=[ { address:'http://www.xiexianbo.xin/', title:'移动互联网实验室前端网站', picName:'images/xiexianbo.jpg',//静态图片路径 }, { address:'http://reference.xiexianbo.xin/', title:'前端知识库', picName:'images/gitbook.png', }, { address:'http://120.79.79.93:9005/user/login', title:'四川省教育综合改革试点项目管理系统', picName:'images/Education.jpg', }, ]; var content = ""; for (var i = 0; i < projectList.length; i++) { content += "<li>"; content += "<a href= \""+projectList[i].address+"\" target= \"view_window\" >"; content += "<img src=\""+projectList[i].picName+"\" alt=\""+projectList[i].title+"\">"; content += "</a>"; content += "<p>"; content += "<span innerText=\""+projectList[i].title+"\">"; content += "<a href= \""+projectList[i].address+"\" </a>"; content += "</p>"; content += "</li>"; } focus_Box.innerHTML=content; new ZoomPic("focus_Box"); };
body中的写法
<body> <div id="focus_Box"> <ul id='ul'> </ul> </div></body>