1. 语法
  2.  
  3. switch(n)
  4. {
  5. case 1:
  6.   执行代码块 1
  7.   break;
  8. case 2:
  9.   执行代码块 2
  10.   break;
  11. default:
  12.   n 与 case 1 和 case 2 不同时执行的代码
  13. }
  14.  
  15. 工作原理：首先设置表达式 n（通常是一个变量）。随后表达式的值会与结构中的每个 case 的值做比较。如果存在匹配，
    则与该 case 关联的代码块会被执行。请使用 break 来阻止代码自动地向下一个 case 运行。
  16. 实例
  17.  
  18. 显示今日的周名称。请注意 Sunday=0, Monday=1, Tuesday=2, 等等：
  19.  
  20. var day=new Date().getDay();
  21. switch (day)
  22. {
  23. case 0:
  24.   x="Today it's Sunday";
  25.   break;
  26. case 1:
  27.   x="Today it's Monday";
  28.   break;
  29. case 2:
  30.   x="Today it's Tuesday";
  31.   break;
  32. case 3:
  33.   x="Today it's Wednesday";
  34.   break;
  35. case 4:
  36.   x="Today it's Thursday";
  37.   break;
  38. case 5:
  39.   x="Today it's Friday";
  40.   break;
  41. case 6:
  42.   x="Today it's Saturday";
  43.   break;
  44. default:
  45. 　　x="Looking forward to the Weekend"; 
  46.  
  47. }
  48.  
  49. 鹰击长空,鱼翔浅底
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <script src="https://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script>
  6. </head>
  7. <body ng-app="">
  8. 我喜欢的网站
  9. <select ng-model="myVar">
  10.   <option value="runoob">www.runoob.com
  11.   <option value="google">www.google.com
  12.   <option value="taobao">www.taobao.com
  13. </select>
  14.  
  15. <hr>
  16. <div ng-switch="myVar">
  17.   <div ng-switch-when="runoob">
  18.      <h1>菜鸟教程</h1>
  19.      <p>欢迎访问菜鸟教程</p>
  20.   </div>
  21.   <div ng-switch-when="google">
  22.      <h1>Google</h1>
  23.      <p>欢迎访问Google</p>
  24.   </div>
  25.   <div ng-switch-when="taobao">
  26.      <h1>淘宝</h1>
  27.      <p>欢迎访问淘宝</p>
  28.   </div>
  29.   <div ng-switch-default>
  30.      <h1>切换</h1>
  31.      <p>选择不同选项显示对应的值。</p>
  32.   </div>
  33. </div>
  34. <hr>
  35.  
  36. <p> ng-switch 指令根据当前的值显示或隐藏对应部分。</p>
  37.  
  38. </body>
  39. </html>
  1.  JS switch 分支语句
  2.  
  3. 描述：根据一个变量的不同取值，来执行不同的代码。
  4.  
  5. 语法结构：
  6.  
  7. switch(变量)
  8.  
  9. {
  10.  
  11.     case 值1:
  12.  
  13.            代码1;
  14.  
  15.            break;
  16.  
  17.     case 值2:
  18.  
  19.            代码2;
  20.  
  21.            break;
  22.  
  23.     case 值3:
  24.  
  25.            代码3;
  26.  
  27.            break;
  28.  
  29.     default:
  30.  
  31.            如果以上条件都不满足，则执行该代码;
  32.  
  33. }
  34.  
  35. 　　switch结构说明：
  36.  
  37. 　　  　  switch、case、break、default都是系统关键字，都必须全小写。
  38.  
  39. 　　　　 switch后的小括号()：小括号内一般是一个变量名，这个变量可能会有不同的取值。
  40.  
  41. 　　　　 每个case的值，与变量的值进行比对，如果一致就执行该case后的代码。
  42.  
  43. 　　　　 所有的case都是“或”的关系，每时每刻只有一个case会满足条件。
  44.  
  45. 　　　　 每个case中的代码执行完毕后，必须要用break语句结束，结束之后，程序将跳到switch结束大括号之后运行。
  46.  
  47. 　　　　如果不写break语句的话，下面所有的case语句都会执行一遍。
  48.  
  49. //实例：输出今天是星期几
  50.  
  51. /*
  52.  
  53.        (1)创建一个日期时间对象，它中有很多的信息：时、分、秒、年、月、日、星期
  54.  
  55.        (2)取出日期对象中的星期值
  56.  
  57.        (3)根据星期值(0-6)来输出中文的星期几
  58.  
  59. */
  60.  
  61. //（1）创建一个系统日期时间对象，其中Date()是系统函数，首字母大写
  62.  
  63. var today = new Date();
  64.  
  65. //（2）从Date对象中取出星期值
  66.  
  67. var week = today.getDay();  //返回0-6，0代表星期日
  68.  
  69. //（3）使用switch来输出今天是星期几
  70.  
  71. var str;
  72.  
  73. switch(week)
  74.  
  75. {
  76.  
  77.        case 1:
  78.  
  79.               str = "一";
  80.  
  81.               break;
  82.  
  83.        case 2:
  84.  
  85.               str = "二";
  86.  
  87.               break;
  88.  
  89.        case 3:
  90.  
  91.               str = "三";
  92.  
  93.               break;
  94.  
  95.        case 4:
  96.  
  97.               str = "四";
  98.  
  99.               break;
  100.  
  101.        case 5:
  102.  
  103.               str = "五";
  104.  
  105.               break;
  106.  
  107.        case 6:
  108.  
  109.               str = "六";
  110.  
  111.               break;
  112.  
  113.        default:
  114.  
  115.               str = "日";
  116.  
  117. }
  118.  
  119. //（4）输出结果
  120.  
  121. document.write("今天是星期"+str)
  122.  
  123. if多条件判断和switch的区别
  124.  
  125. if中的条件一般是一个范围(a>100)，而switch中的条件一般是一个变量的不同取值。

js switch的使用 ng-switch的使用方法的更多相关文章

  1. 【转】3篇：Xilium CefGlue 关于 CLR Object 与 JS 交互类库封装报告：官方原生方法分析

    作者: 牛A与牛C之间 时间: 2013-11-17 分类: 技术文章 | 暂无评论 | 编辑文章 主页 » 技术文章 » 第3篇:Xilium CefGlue 关于 CLR Object 与 JS ...

  2. JS提交对象数组到服务端的方法总结(C#实例)

    *转载请注明出处: 作者:willingtolove: 本文链接:http://www.cnblogs.com/willingtolove/p/4741549.html 正文: 1. 方法一:利用aj ...

  3. 在Android的webview中定做js的alert,confirm和prompt对话框的方法

    在Android的webview中定制js的alert,confirm和prompt对话框的方法 http://618119.com/archives/2010/12/20/199.html 1.首先 ...

  4. 【转】第4篇：Xilium CefGlue 关于 CLR Object 与 JS 交互类库封装报告：委托回调方法分析

    作者: 牛A与牛C之间 时间: 2013-11-18 分类: 技术文章 | 暂无评论 | 编辑文章 主页 » 技术文章 » 第4篇:Xilium CefGlue 关于 CLR Object 与 JS ...

  5. js动态创建及移除div的方法

    本文实例讲述了js动态创建及移除div的方法.分享给大家供大家参考.具体实现方法如下: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 ...

  6. [转]js中几种实用的跨域方法原理详解

    转自:js中几种实用的跨域方法原理详解 - 无双 - 博客园 // // 这里说的js跨域是指通过js在不同的域之间进行数据传输或通信,比如用ajax向一个不同的域请求数据,或者通过js获取页面中不同 ...

  7. JS中的call、apply、bind方法

    JS中的call.apply.bind方法 一.call()和apply()方法 1.方法定义 call方法: 语法:call([thisObj[,arg1[, arg2[,   [,.argN]]] ...

  8. 原生JS—实现图片循环切换的两种方法

    今天我们主要讲讲如何使用原生JS实现图片的循环切换的方法.多余的话我们就不多说了,我们一个一个开始讲吧. 1  原生JS实现图片循环切换 -- 方法一 在上栗子之前我们先简单介绍一下所用的一些知识点. ...

  9. JavaScript进阶(四)js字符串转换成数字的三种方法

    js字符串转换成数字的三种方法 在js读取文本框或者其它表单数据的时候获得的值是字符串类型的,例如两个文本框a和b,如果获得a的value值为11,b的value值为9 ,那么a.value要小于b. ...

  10. JS函数可以再添加属性（包括方法）

    1 前言 JS函数可以再添加属性(包括方法),这个有点有趣,记录一下. 2 代码 <!DOCTYPE html> <html> <head> <title&g ...

随机推荐

  1. 新安装的MySQL的简单配置

    修改配置文件 bind-address = 10.6.20.1 port = 3306 character_set_server = utf8 max_connect_errors = 1000000 ...

  2. vim插件之pathogen，NERDTree，Command-T，Powerline

    pathogen 功能说明 一个插件包往往具备多种功能,每个文件根据Vim的路径约定会放置到不同的目录下,通用插件放到plugin下,语法高亮插件放到syntax下,自动加载插件放到autoload下 ...

  3. 引入css的几种方式

      使用CSS样式的几种方式 CreateTime--2017年10月11日16:45:26 Author:Marydon a.外部样式 a1.链接式(推荐使用) <link href=&quo ...

  4. JSTL不同版本和EL表达式的关联

    JSTL目前有3个版本:JSTL1.0.JSTL1.1.JSTL1.2 JSTL1.0和JSTL1.1包含jstl.jar和standard.jar这2个jar包,在j2ee4的版本中是需要单独引用这 ...

  5. logging日志管理-将日志写入文件

    # -*- coding: cp936 -*- # test.py #http://blog.chinaunix.net/uid-27571599-id-3492860.html #logging日志 ...

  6. Drupal administration theme

    Drupal允许为管理后台设置独立的theme,保存在系统变量variable_get('admin_theme'). Drupal使用全局变量$theme来保存当前请求对应的主题.Drupal在启动 ...

  7. bss段，代码段及数据段,堆栈段的区别

    bss段,代码段及数据段,堆栈段的区别 时间:2012-11-21 10:0772人阅读 BSS段:BSS段(bss segment)通常是指用来存放程序中未初始化的全局变量的一块内存区域.BSS是英 ...

  8. 实践：由0到1-无线大数据UX团队的成长

    背景 大数据产品的在项目成立之初,采用的是模仿原有网优工具的方式做UI设计,由BA主导画草图.手绘线框图.excel制作,更有直接打开参考产品做原型的方式,没有统一的设计和规范可言.随着团队逐渐增多. ...

  9. 如何高效的阅读hadoop源代码？

    个人谈谈阅读hadoop源代码的经验. 首先,不得不说,hadoop发展到现在这个阶段,代码已经变得非常庞大臃肿,如果你直接阅读最新版本的源代码,难度比较大,需要足够的耐心和时间,所以,如果你觉得认真 ...

  10. 【转】MyEclipse 9.0正式版官网下载（附Win+Llinux激活方法、汉化包）

    MyEclipse 9.0 经过 M1,M2,终于出了正式版(MyEclipse For Spring 还是 8.6.1).该版本集成了 Eclipse 3.6.1,支持 HTML5 和 JavaEE ...