广东信息科技职业培训学院
广信IT学院
技术文献总结装订册
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
年级：IT2002 姓名：李凯顺 性别： 男 籍贯：湖南
毕业中学：冷水镇中心校 入学时间： 2020年8月1日
身份证号码：431126200505070271 微信号：lks2423973507
本技术文献起止时间 2022年4月 8日-2022年4月10日
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
文献目录
| 顺序 | 文献编号 | 文献类型 | 题目 | 开发工具 | 关键技术 |
| 01 | 专题技术文献 | JS聊天器 | Adobe Dreamweaver 2021 | Adobe Dreamweaver 2021 | |
备注：“文献编号”由学院工作人员填写；文献类型填写“专题技术”或“项目研发”
广东信息科技职业培训学院编制
评 分
文献总分： 折算后标准分： 阅卷教师签名
（有效）专题技术文献评分
| 序 号 | 题目 | 各项评分 | 文献 得分 | |||
| 主题 深浅 （20） | 描述 清晰 （40） | 图文 搭配 （20） | 分享 评定（20） | |||
| 01 | JS聊天器 | |||||
| 专题技术文献平均分： 文献数量加分： 篇x10分/篇= 分 专题技术文献总分： | ||||||
项目研发文献评分
| 序 号 | 题目 | 各项评分 | 文献 得分 | |||
| 业务模块数量 （20） | 模块复杂度 （30） | 图文 描述 （30） | 分享 评定（20） | |||
| 01 | ||||||
| 02 | ||||||
| 项目研发文献平均分： 文献数量加分： 篇x10分/篇= 分 项目研发文献总分： | ||||||
备注：
1、分享评定：发表到指定的3个网站，成功1个加5分，成功2个加10分，成功3个加20分。
2、实际总分=专题技术文献平均分+项目研发文献平均分*3。
3、所有文献必须提交对应的程序源码和项目演示视频，按照表格题目命名，放在同一个文件夹。
4、文献和源码、视频等文件，统一放到一个文件夹里面并提交给班长，文件夹命名格式如：
“广信IT17-1张悦190119文献与源文件”。
文献种类：专题技术总结文献
开发工具与关键技术：Adobe Dreamweaver 2021
作者：李凯顺 ；年级：20级2班 撰写时间：2022年4月8日
文献编号： 归档时间： 年 月 日
JS聊天器
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
开发工具与关键技术：Adobe Dreamweaver 2021
作者：李凯顺
撰写时间：2022年4月7日
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~1.源代码部分
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style type="text/css">
.talk_con{
width:700px;
height:500px;
border:1px solid #666;
margin:50px auto 0;
background:#f9f9f9;
}
.talk_show{
width:580px;
height:420px;
border:1px solid #666;
background:#fff;
margin:10px auto 0;
overflow:auto;}
.talk_input{
position:relative;
width:580px;
margin:10px auto 0;}
.whotalk{
width:80px;
height:30px;
float:left;
outline:none;
}
.talk_word{
width:372px;
height:26px;
padding:0px;
float:left;
margin-left:10px;
outline:none;
text-indent:10px;
}
.talk_sub{
width:56px;
height:30px;
float:left;
margin-left:2px;
}
.talk_sub1{
position:absolute;
top:0px;
width:56px;
height:30px;
float:left;
margin-left:2px;
}
.atalk{
margin:10px;
}
.atalk span{
display:inline-block;
background:#0181cc;
border-radius:10px;
color:#fff;
padding:5px 10px;
}
.btalk{
margin:10px;
text-align:right;
}
.btalk span{
display:inline-block;
background:#ef8201;
border-radius:10px;
color:#fff;
padding:5px 10px;
}
</style>
</head>
<body>
<div class="talk_con">
<div class="talk_show" id="words">
<div class="atalk"><span>A说：吃饭了吗？</span></div>
<div class="btalk"><span>B说：还没呢，你呢？</span></div>
</div>
<div class="talk_input">
<select class="whotalk" id="who">
<option value="0">A说：</option>
<option value="1">B说：</option>
</select>
<input type="text" class="talk_word" id="talkwords">
<input type="button" value="发送" class="talk_sub" id="talksub">
<input type="button" value="清除" class="talk_sub1" id="talksub1">
</div>
</div>
<script type="text/javascript">
var talksub =document.getElementById("talksub");
console.log(talksub);
var talksub1 =document.getElementById("talksub1");
console.log(talksub1);
talksub.onclick = function(){
var who = document.getElementById("who").value;
var talkwords = document.getElementById("talkwords").value;
var words = document.getElementById("words");
var str;
if(who == "0"){
if(talkwords==""){
alert("内容不能为空");
return false;}
str ='<div class="atalk"><span>A说:' +talkwords+ '</span></div>';
}else{
str ='<div class="btalk"><span>B说:' +talkwords+' </span></div>';}
words.innerHTML = words.innerHTML+str ;}
talksub1.onclick = function(){
talkwords.value= "";}
</script>
</body>
</html>
2.效果展示
3.效果展示
4.效果展示
每个月发布在同一个主题下，每个月的网页链接和二维码都是同一个。
