abstract：<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0">&
<!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>微博发布</title>
<link rel="stylesheet" href="layui/css/layui.css" type="text/css">
<style>
#text1{width:492px;height:100px;border:2px solic gray;display:block;margin:0px auto;}
.b1 span{float:left;width:52px;}
.layui-icon{font-size:14px;padding-right:2px;font-weight: bold;}
</style>
</head>
<body>
<div class="box" style="width:500px;height:160px;border:4px solid pink;padding:10px;">
<img src="images/12.png" alt="有什么新鲜事想告诉大家？">
<span style="color:#ccc;float:right;">还可以输入<i id="nn"></i>字</span>
<textarea id="text1" ></textarea>
<div class="b1" style="width:492px;height:40px;text-align: center;line-height: 40px;">
<span><i class="layui-icon layui-icon-face-smile" style="color:#ff6500;"></i>表情</span>
<span><i class="layui-icon layui-icon-picture" style="color:lightgreen;"></i>图片</span>
<span><i class="layui-icon layui-icon-video" style="color:lightskyblue;"></i>视频</span>
<span><i class="layui-icon layui-icon-theme" style="color:plum;"></i>话题</span>
<span style="width:75px;"><i class="layui-icon layui-icon-top" style="color:#ff6500;"></i>头条文章</span>
<span><i class="layui-icon layui-icon-more"></i></span>
<span style="padding:0px 10px;">公开<i class="layui-icon layui-icon-down" style="float:none;"></i></span>
<button style="width:80px;height:30px;color:white;background-color: #ff6500;border:none;border-radius:3px;">发布</button>
</div>
</div>
<script>
window.onload=function(){
var txt1=document.getElementById('text1')
var s1=document.getElementById('nn')
var bt1=document.getElementsByTagName('button')[0]
var n
txt1.oninput=function(){ //onkeyup不如oninput
n=145-txt1.value.length; //单词千万不能拼错
if (n>=0){
s1.style.color='black';
}else{
s1.style.color='red';
}
s1.innerHTML=n;
}
bt1.onclick=function(){
if(n<0){
alert('字数超了');
txt1.focus();
}else if(n==145){
alert('没有输入');
}else{
alert('发布成功');
}
}
}
</script>
</body>
</html>
onkeyup不如oninput，譬如按住一个键不松时用oninput才有效果。注意关键词不能拼错，onload函数的花括号的位置要注意。
Correcting teacher：天蓬老师Correction time：2019-02-01 16:25:12
Teacher's summary：编辑器通常会提供语法提示的, 如果担心写错, 可以安装一些语法提示插件, 或者使用智能IDE: webstorm , 不要太委屈自己啦
