自学web前端练手——简易版成绩统计页面（html+css+js）_html+css chart 统计页面_lvshaoshishang的博客-程序员宅基地
遇到的问题：
①刚开始innerHTML一直显示不出来，然后发现是犯了之前跟“js的随机验证码和验证”这篇博文一模一样的错误_(:з」∠)_
var number=f1.getElementsByTagName(‘input’);
//获取到的时一组元素，number[i]时其中的一个文本框元素，它的值得通过value属性来获取，
number[i].value才是某个文本框元素的值
②表单提交后页面自动刷新。因为本次目标是要查看成绩统计结果，所以不需要表单提交后页面自动刷新。百度之后发现有两个方法：
1.将button标签内的按钮类型设置为submit，或者将标签内按钮类型从type="submit"修改为type=“button”
（此方法还有button按钮样式，较为美观，我采用了这个方法）
2.使用submit事件提交表单（此方法没有按钮样式，即单纯的文本）
要求：
（1）创建网页并编写HTML基本结构
（2）提示用户输入7个学生成绩，保存在数组中
（3）计算总分并输出
（4）计算平均分并输出
（5）输出有几个成绩不及格（即<60分）
效果如下：
按确认按钮提交表单后显示成绩统计结果。
按重置按钮表单清零。
重新输入成绩提交后显示新的成绩统计结果。
代码如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
#top{
margin: 0 auto;
height: 70px;
background-color: #303030;
}
#top_logo{
background: url(swing3.gif) 50px 2px no-repeat;
color: #fff;
font-size: 46px;
font-weight: bold;
font-family: "楷体";
width: 400px;
float: left;
vertical-align: middle;
height: 65px;
line-height: 65px;
padding: 1px 1px 1px 90px;
}
#main{
height: 500px;
background-color: #cff;
text-align: center;
}
h3{
height: 20px;
line-height: 20px;
text-align: center;
color:#000;
}
#resul{
height: 150px;
line-height: 150px;
font-size: 20px;
color: #000;
}
#footer{
height: 100px;
background-color: #303030;
font-size: 14px;
color: #cff;
text-align: center;
line-height: 100px;
}
</style>
</head>
<body>
<div id="top">
<div id="top_logo">
学生成绩统计系统
</div>
</div>
<div id="main">
<h3>请输入7个学生成绩</h3>
<form name="grade" id="f1">
<div><input type="text" name="number" class="mark"></div>
<div><input type="text" name="number" class="mark"></div>
<div><input type="text" name="number" class="mark"></div>
<div><input type="text" name="number" class="mark"></div>
<div><input type="text" name="number" class="mark"></div>
<div><input type="text" name="number" class="mark"></div>
<div><input type="text" name="number" class="mark"></div>
<!-- <submit onclick="del();">确认</submit> -->
<button type="button" onclick="del()">确认</button>
<button type="reset">重置</button>
</form>
<div id="result"></div>
</div>
<div id="footer">Copyright ◎ 安徽大学计算机科学与技术学院 信息技术英才班 【2020版】</div>
<script>
function del(){
var f1=document.getElementById('f1');
var number=f1.getElementsByTagName('input');
var count=0;
var sum=0;
for(var i=0;i<7;i++){
sum=sum+parseInt(number[i].value);
if(parseInt(number[i].value)<60){
count=count+1;
}
}
var avg=parseInt(sum/7);
document.getElementById('result').innerHTML="总分为："+sum+"<br />平均分为："+avg+"<br />成绩不及格的人数有："+count;
}
</script>
</body>
</html>
智能推荐
【2019年乐山师范学院程序设计大赛 --- J. 寻找舞伴】贪心_来日浅谈的博客-程序员宅基地
【2019年乐山师范学院程序设计大赛 --- J. 寻找舞伴】贪心题目来源：点击进入【2019年乐山师范学院程序设计大赛 — J. 寻找舞伴】Description学校周末举办舞会，有 n 位男同学和 m 位女同学参加。每位同学的舞蹈熟练度可能不一样，要求男同学与女同学之间搭配形成搭档，且舞蹈熟练度最多相差 1。分别给出每位男同学的舞蹈熟练度与每位女同学的舞蹈熟练度，需要能求出可以组合的最...
ElasticSearch安装配置（es）_es安装配置_NIki_ya的博客-程序员宅基地
一、安装配置es1、搭建配置es# 创建es容器# es的端口# 9200 走http协议端口# 9300 代码层面tcp端口docker run -di --name elasticsearch -p 9200:9200 -p 9300:9300 elasticsearch:6.5.0# 登录es容器docker exec -it elasticsearch /bin/bash# 修改elasticsearch.yml文件，添加跨域配置http.cors.enabled:.._es安装配置
MFC----设备上下文_Sky_Internet的博客-程序员宅基地
关于设备上下文（HDC）专题一、句柄与HDC “句柄”是整个windows编程的基础，它通常是一个四字节长（32位的）的整数值，用来唯一标识应用程序中的不同对象和同类对象中的不同的实例，诸如，一个窗口，按钮，图标，滚动条，输出设备，控件或者文件等，应用程序能够通过句柄访问相应的对象的信息。但是，句柄不是一个指针，程序不能利用句柄来直接阅读它所指示的信息。如果句
通过lsyncd 设置两个linux（centOS7在线，centos6.5离线）服务器之间的目录文件互相实时同步_linux 离线安装 lsyncd_Talg的博客-程序员宅基地
通过lsyncd 设置两个linux（centOS7）服务器之间的目录文件互相实时同步官网开源地址https://github.com/axkibe/lsyncd官网配置手册https://axkibe.github.io/lsyncd/注意：Lsyncd存在数据被替换风险，操作前请做好数据备份！Lsyncd 是一个简单高效的文件同步工具，通过lua语言封装了 inotify 和 rs..._linux 离线安装 lsyncd
mysql 数据拦截器_mybatis拦截器实现数据脱敏&拦截器使用_还是叫大华吧的博客-程序员宅基地
今天遇到个需求需要对现有的数据进行脱敏处理。于是简单研究了下。其实拦截器对脱敏处理主要处理两种数据，一种是bean类型，一种是map类型。普通的javabean利用注解+反射来处理，map的数据自己维护需要脱敏的key以及规则。bean类型是用mybatis以及mybatis-plus自动生成的SQL映射的；map类型是手写的返回map类型的SQL和mybatis-plus的返回map类型的数据。..._mybatis 数据加密解密interceptor
给ProgressBar 设置圆形进度条颜色_progressdialog 进度条颜色_Zoe_8的博客-程序员宅基地
设置圆形进度条的颜色_progressdialog 进度条颜色
随便推点
json中load，loads，dump，dumps用法和区别_js.dumps-程序员宅基地
json.dumps()json.dump()是将字典类型转化成字符串类型。import jsondic = {‘a’:‘1111’,‘b’:‘2222’,‘c’:‘3333’,‘d’:‘4444’}st = json.dumps(dic)print(“我是字典类型的”, dic)print(“我是字符串类型的”,st)print(type(dic))print(type(st))代码输出结果：我是字典类型的 {‘a’: ‘1111’, ‘b’: ‘2222’, ‘c’: ‘3333._js.dumps
css可见性_budaoweng0609的博客-程序员宅基地
overflow : hidden 将超出部分进行隐藏display:none 直接将元素隐藏 隐藏后不占原来的位置visibility: none 将元素隐藏 但隐藏后占据原来的位置display:block 将元素进行显示（多与js进行搭配）visibility:visible 显示元素visibility的应用陷阱：一个大盒子里面放一个小盒子.大
Microsoft Visual C++ Runtime Library Runtime Error的一个解决方法_Fibonaccccci的博客-程序员宅基地
今天打开电脑，打开软件时出现了如下情况：软件打不开并且会出现Runtime error错误，遂在网上寻找解决方法，都试了试但是并未解决问题。想了想，这个问题出现的原因应该是VC++的运行库出现了问题，导致基于C++编写的软件无法运行，因为没有运行库。于是卸载所有的Microsoft Visual C++运行库，重新下载所有版本的运行库，从2005到2019，问题解决。（想来思路应该没错，..._microsoft visual c++ runtime library runtime error!
所有的JSP文件全部有红叉_jsp页面红叉_藤原豆腐Initial D的博客-程序员宅基地
JavaBuildPath_jsp页面红叉
Flink的Task与SubTask理解_flink subtask_黄土高坡上的独孤前辈的博客-程序员宅基地
文章目录官网参考1.任务2.通过flinkUI可以看到 有几个框就是几个Task3.程序模型4.流的分类5.Operator Chains6.Task Slot (TM = JVM)7.获取整个算子的执行计划8.flink通过webUI的Jar包传到哪里去了 java.io.tmpdir=/tmp官网参考 # https://ci.apache.org/projects/flink/flink-docs-release- 1.11/concepts/flink-architecture.html_flink subtask
required 'Android.support.v4.app.Fragment' found 'android.app.Fragment.'错误解决_菜花神的博客-程序员宅基地
跟着网上教程一步一步的做一个andriod studio例子 结果在 FragmentTransaction fTransaction =fManager.beginTransaction();报错： required 'Android.support.v4.app.Fragment' found 'android.app.Fragment.'然后发现import包的时候就有点乱，