<!DOCTYPE html>
<html>
<head lang="en"><meta charset="UTF-8"><title>课工场论坛列表</title><link href="css/bbs.css" rel="stylesheet">
</head>
<body>
<script>var tou=new Array("tou01.jpg ");
</script>
<div class="bbs"><header><span onclick="show()">我要发帖</span></header><section><ul></ul></section><div class="post"><input class="title" placeholder="请输入标题（1-50个字符）">所属版块：<select><option value="请选择版块">请选择板块</option><option value="电子书籍">电子书籍</option><option value="新课来了">新课来了</option><option value="新手报到">新手报到</option><option value="职业规划">职业规划</option></select><textarea class="content"></textarea><input class="btn" value="发布"onclick="upload()"></div>
</div>
<script>//我要发帖按钮单击事件function show(){//获取隐藏divvar div=document.getElementsByClassName("post")[0];div.style.display="block";}//发布按钮的单击事件function upload(){//创建一个数组保存四张头像var tou=new Array("images/tou01.jpg","images/tou02.jpg","images/tou03.jpg","images/tou04.jpg");var li=document.createElement("li");var div=document.createElement("div");var img=document.createElement("img");var h1=document.createElement("h1");var p=document.createElement("p");var title=document.getElementsByClassName("title")[0].value;//获取所属板块var ban=document.getElementsByTagName("select")[0].value;//随机生成var index=Math.floor(Math.random()*4);//获取系统时间var time=new Date();var year=time.getFullYear();//获取月var yue = time.getMonth() + 1;//获取日var ri = time.getDate();//获取时var shi = time.getHours();var fen =time.getMinutes();//获取秒var miao= time.getSeconds();var shu="发表板块"+ban+" 发表时间"+year+"-"+yue+"-"+ri+" "+shi+":"+fen+":"+miao;//将各项数据放入对应的标签img.setAttribute("src",tou[index]);h1.innerHTML=title;p.innerHTML=shu;//获取ul标签var ul=document.getElementsByTagName("ul")[0];div.appendChild(img);li.appendChild(div);li.appendChild(h1);li.appendChild(p);//将li放入ul第一个位置ul.insertBefore(li,ul.firstChild);document.getElementsByClassName("post")[0].style.display="none";document.getElementsByClassName("title")[0].value="";document.getElementsByClassName("content")[0].value="";}
</script>
</body>
</html>