<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

<label for="num">成绩：</label><input type="number" placeholder="请输入数字" id="num">

<input type="button" onclick="check()" value="检查">

<p id="result"></p>

<script>

function  check() {

  //结果输出标签

    result = document.getElementById("result")

  //控件方式输入

    let num = document.getElementById("num").value;

    if (num === undefined || num === "") {

        //弹窗方式输入

        num = prompt("输入数字");

    }

  if (num===""){

    alert("请输入0-100的茄子。")

    return false;

  }

  if(num>100 || num<0){

    alert("非法数字，请输入1-100的茄子。")

    return false;

  }

  switch (parseInt(num / 10)) {

    case 10:

    case 9:

      alert("优秀");

      result.innerHTML="<font color='blue'>优秀</font>"

      break;

    case 8:

      alert("良好");

      result.innerHTML="<font color='#8a2be2'>良好</font>"

      break;

    case 7:

      alert("中等");

      result.innerHTML="<font color='#9acd32'>中等</font>"

      break;

    case 6:

      alert("及格");

      result.innerHTML="<font color='yellow'>及格</font>"

      break;

    case 5:

    case 4:

    case 3:

    case 2:

    case 1:

    case 0:

      alert("不及格");

      result.innerHTML="<font color='red'>不及格</font>"

      break;

    default:

      alert("不合法的数字");

  }

}

</script>

</body>

</html>

【前端】【JavaScript】通过成绩判断等级的更多相关文章

  1. 实例演示 kino.razor （前端 Javascript 模板工具，Razor 风格）的使用

    前言 对于习惯了 ASP.NET MVC Razor 模板引擎的人来说,比如我,一直在寻找前端 Javascript 端的 Razor 模板工具.这之前,我也了解到很多Javascript 端的模板工 ...

  2. Web前端-JavaScript基础教程上

    Web前端-JavaScript基础教程 将放入菜单栏中,便于阅读! JavaScript是web前端开发的编程语言,大多数网站都使用到了JavaScript,所以我们要进行学习,JavaScript ...

  3. Fundebug前端JavaScript插件更新至1.2.0

    摘要: Fundebug的前端JavaScript错误监控插件更新至1.2.0:支持监控WebSocket连接错误:修复了监控unhandledrejection错误的BUG,即未用catch处理的P ...

  4. OpenJudge计算概论-成绩判断

    /*========================================================= 成绩判断 总时间限制: 1000ms 内存限制: 6000kB 描述 输入一个0 ...

  5. 详解升讯威在线客服系统前端 JavaScript 脚本加密技术（1）

    我在业余时间开发维护了一款免费开源的升讯威在线客服系统,也收获了许多用户.对我来说,只要能获得用户的认可,就是我最大的动力. 这段时间有几个技术小伙伴问了我一个有意思的问题:"你的前端脚本是 ...

  6. JavaScript根据文件名判断文件类型

    //JavaScript根据文件名判断文件类型 var imgExt = new Array(".png",".jpg",".jpeg",& ...

  7. 【跟着子迟品 underscore】JavaScript 中如何判断两个元素是否 "相同"

    Why underscore 最近开始看 underscore.js 源码,并将 underscore.js 源码解读 放在了我的 2016 计划中. 阅读一些著名框架类库的源码,就好像和一个个大师对 ...

  8. 前端JavaScript规范

    前端JavaScript规范 http://www.imooc.com/article/1402 http://greengerong.com/blog/2015/05/09/qian-duan-ja ...

  9. 在C#后端处理一些结果然传给前端Javascript或是jQuery

    在C#后端处理一些结果然传给前端Javascript或是jQuery,以前Insus.NET有做过一个例子<把CS值传给JS使用 >http://www.cnblogs.com/insus ...

  10. 前端javascript模板

    doT.js——前端javascript模板引擎问题备忘录 我手里维护的一个项目,遇到一个问题:原项目的开发人员在Javascript中,大量的拼接HTML,导致代码极丑,极难维护.他们怎么能够忍受的 ...

随机推荐

  1. Nuxt.js 应用中的 app:redirected 钩子详解

    title: Nuxt.js 应用中的 app:redirected 钩子详解 date: 2024/10/3 updated: 2024/10/3 author: cmdragon excerpt: ...

  2. KubeSphere 社区双周报 | 2024.01.04-01.18

    KubeSphere 社区双周报主要整理展示新增的贡献者名单和证书.新增的讲师证书以及两周内提交过 commit 的贡献者,并对近期重要的 PR 进行解析,同时还包含了线上/线下活动和布道推广等一系列 ...

  3. CMDB实践指南：项目规划与实施策略解析

    随着现代企业IT系统的日益复杂,如何有效管理这些庞大的IT资产和资源,成为每个企业必须面对的重要问题.CMDB应运而生,帮助企业集中管理IT资源,维护系统的稳定性,并支持故障排查与决策制定.本文将深入 ...

  4. Web渗透07_脚本代码注入和OS命令注入( 恐怖级别 )

    1 PHP代码注入 1.1 原理成因 网站对用户的输入过滤出现问题,同时网站的脚本编写用到一些危险函数 eval(),assert().如果被攻击者发现漏洞,直接可能造成攻击者完全控制整个web甚至是 ...

  5. C# 动态调用webservice代码

    /// <summary> /// 动态调用WebService /// </summary> /// <param name="url">UR ...

  6. 递推（C语言）

    文章目录 1.斐波那契数列 2.太波那契数列 3.二维递推问题 4.实战 4.1 力扣509 斐波那契数 4.2 力扣70 爬楼梯 4.3 力扣119 杨辉三角|| 递推最通俗的理解就是数列,递推和数 ...

  7. Graphische Datenverarbeitung Ⅰ 学习笔记

    1. Pipeline 1.1 Graphische Primitive 1.2 Model and View Transform 1.3 Vertex Shading 1.4 Clipping 1. ...

  8. Maven 项目获取 git 分支、提交等信息

    git-commit-id-plugin 是一个 Maven 插件,用于在 Maven 项目的构建过程中自动获取 git 仓库的信息,如最后一次提交的 ID.分支名称.构建时间等,并将这些信息注入到项 ...

  9. c++11多线程入门<学习记录>

    最近学习了c++多线程相关知识,也算是对这方面内容的入门 视频链接c++11并发与多线程视频课程 看了大概两周,简单进行总结 参考文章C++11并发与多线程 PS:c++11提供了标准的可跨平台的线程 ...

  10. c++设计模式：设计原则

    c++设计八大原则(降低改变带来的代码修改) 一.依赖倒置原则(DIP) 1.高层模块(稳定)不应该依赖于低层模块(变化),二者应该依赖于抽象(更稳定) <高层模块 包括 低层模块所依赖的抽象, ...