abstrait:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>智能在線客服系統(tǒng)作業(yè)</title> <style type=&qu
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>智能在線客服系統(tǒng)作業(yè)</title>
<style type="text/css">
div:nth-child(1){
width:450px;
height:650px;
background-color: lightskyblue;
margin:30px auto;
color:#333;
box-shadow:2px 2px 2px #808080;
border-radius: 20px;
}
h2{
text-align:center;
margin-bottom:-10px;
}
div:nth-child(2){
width:400px;
height:500px;
border:4px double green;
background-color: #efefef;
margin:20px auto 10px;
}
ul{
list-style: none;
line-height:2em;
overflow:hidden;
padding:15px;
}
table{
width:90%;
height:80px;
margin:auto;
}
textarea{
border:none;
resize:none;
background-color:lightyellow;
}
button{
width:60px;
height:40px;
background-color:seagreen;
color:white;
border:none;
}
button:hover{
cursor:pointer;
background-color:orange;
}
</style>
</head>
<body>
<div>
<h2>在線客服系統(tǒng)</h2>
<div>
<ul>
<li></li>
</ul>
</div>
<table>
<tr>
<td align="right"><textarea name="text" cols="50" rows="4"></textarea></td>
<td align="left"><button type="button">發(fā)送</button></td>
</tr>
</table>
</div>
<script>
let btn=document.getElementsByTagName('button')[0];
let text=document.getElementsByName('text')[0];
let list=document.getElementsByTagName('ul')[0];
let sum=0;
btn.onclick=function(){
//獲取用戶提交的內(nèi)容
if(text.value.length===0){
alert('請問你是不是忘記輸入內(nèi)容了?')
return flase;
}
let userComment=text.value;
text.value=''
let li=document.createElement('li');
let userPic='<img src="inc/11.jpg" width="30" style="border-radius: 50%">';
li.innerHTML=userPic+' '+userComment;
list.appendChild(li);
sum +=1;
setTimeout(function(){
let info=[
'您好,請問有什么可以幫助您?',
'我無法解決的問題您可以撥打我們的客服電話哦!',
'關于退貨流程你可以參考官網(wǎng)流程。',
'請問您需要什么服務呢?',
'請稍等,我正在為您查閱資料。。。。。。'
];
let temp=info[Math.floor(Math.random()*4)];
let reply=document.createElement('li');
let kefuPic='<img src="inc/22.jpg" width="30" style="border-radius: 50%">';
reply.innerHTML=kefuPic+' '+'<span style="color:red;">'+temp+'</span>';
list.appendChild(reply);
sum +=1;
},2000);
if(sum>10){
list.innerHTML='';
sum=0;
}
}
</script>
</body>
</html>
這個作業(yè)基本按照課程做的 沒做什么變化 因為課程學習的時間來不及了。。。。。。對于總結(jié)的話 一個是去隨機數(shù)調(diào)用語句 稍微想了下 因為數(shù)組里5條語句 所以應該是[0-4]來代表 那么通過Math,random()的值為0-1之間 通過乘以4 然后用Math.floor向下取整,可以得到0-4的數(shù)字
Professeur correcteur:韋小寶Temps de correction:2019-02-28 13:26:24
Résumé du professeur:寫的沒毛病 總結(jié)的也是正確的 課后沒事記得要多去練習哦!