abstract：JS实现一个在线客服聊天1.获取DOM元素//通过按钮标签名获取元素：ElementsByTagNamelet btn = document.getElementsByTagName('button')[0];//通过textarea文本域name名获取元素：getElementsByNamelet text = document.getElementsByName('te
JS实现一个在线客服聊天
1.获取DOM元素
//通过按钮标签名获取元素：ElementsByTagName
let btn = document.getElementsByTagName('button')[0];
//通过textarea文本域name名获取元素：getElementsByName
let text = document.getElementsByName('text')[0];
//通过按钮标签名获取元素：ElementsByTagName
let list = document.getElementsByTagName('ul')[0];
2.计数器，用来计算聊天次数
let sum = 0;
3.事件函数：
按钮事件：
//判断用户是否输入
if（输入框value值的length===0）{
alert（‘您未输入内容，请输入后在发送！’）
//输入框返回一个假值
return false；
//清空上次输入的内容userCommentf
声明一个userCommentf = text.value；
//创建一个新DOM元素节点 li标签
let li = document.createElement('li');
//把li标签的内容替换成userCommentf
li.innerHTNML = userCommentf;
//let userPic用户头像；
let userPic = '';
合并用户头像+用户输入的文字内容；
li.innerHTNML=userPic+‘ ’+userCommentf
//然后是list ul标签更新li节点 appendChild（）更新节点 作用是插入新的对话在聊天窗口
list.appendChild('li');
//接着让聊天记录，有新的内容的时候自增1
sum+=1；
//setTimeout设置定时器 默认是2秒后自动回复内容
setTimeout（function）{
let info =[ '您好'，'人工服务'，'发货时间'，'热线电话'，'工作时间'，]；
}
//Math.floor取整不带小数点 Math.random取随机数()*3是0-3之间的整数
let temp = info[Math.floor(Math.random()*3)];
let reply = document.createElement('li');
// reply 创建一个新li节点
let reply = document.createElement('li');
//kefuPic 客服头像
let kefuPic = '';
//reply 新的li节点插入页面上显示客服头像+temp 自动回复内容
reply.innerHTML = kefuPic + ' ' + ''+temp+'';
//然后把上面的内容插入到ul里面，js就是list里面，
list.appendChild(reply);
// 最后sum完成后自增+1
sum += 1;
//定时器可以设置2秒的时间回复注意格式哦！
setTimeout(function(){};2000）
// 当聊天记录达到10条时清空窗口
if (sum > 10) {
list.innerHTML = '';
sum = 0;
}
在线客服
Correcting teacher：天蓬老师Correction time：2019-01-13 09:29:28
Teacher's summary：想起来了, 这个课程是我录制的, 你做的客服练习,就是考察你的dom操作, 看来你掌握了
