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. HibernateDaoSupport与JdbcDaoSupport

    Dao 的支持类可以有好多,如: JdbcDaoSupport , HibernateDaoSupport ,JdoDaoSupport等,下面对最常用的HibernateDaoSupport与Jdb ...

  2. tomcat 禁用access.log

    修改 server.xml 注释掉,如: <!-- Access log processes all example. Documentation at: /docs/config/valve. ...

  3. mysql循环批量插入测试数据

    http://blog.51cto.com/tianxingzhe/1676097 DROP PROCEDURE test_insert ; DELIMITER $$ CREATE PROCEDURE ...

  4. eclipse JRE(unbound)问题

    eclipse eclipse eclipse eclipse     eclipse JRE(unbound) createTime--2016年10月18日14:18:59 Author:Mary ...

  5. 函数式编程工具：filter和reduce

    # -*- coding: utf-8 -*- #python 27 #xiaodeng #函数式编程工具:filter和reduce #python内置函数中,map函数是用来进行函数式编程这类工具 ...

  6. XMLHttpRequest cannot load ...谷歌浏览器跨域问题

    HTML页面通过Ajax调用公网web服务时,浏览器请求发送成功,但是响应的 xhr.status==0,控制台报错如下 XMLHttpRequest cannot load http://ws.we ...

  7. 如何在网上隐藏自己的IP地址(转)

    摘自:http://net.yesky.com/396/3082396.shtml 在某些场合(例如论坛发贴时)有些网友希望能隐藏自己的IP地址,以免IP被记下,为安全起见,QQ聊天时也不希望别人知道 ...

  8. js replaceChild

    //父亲元素.replaceChild(新,旧) 1 <ul id="city"> <li id="bj">北京</li> ...

  9. 我的硬盘安装ArchLinux+xorg+gnome+美化

    整个安装需要联接网络!现在的xorg为6.8.1,gnome为2.8.0                看了大家为了使用gnome,出现了那么多问题!这里我就推荐一个发行版,再安装上gnome2.8. ...

  10. mermaid 语法

    a:focus { outline: thin dotted #333; outline: 5px auto -webkit-focus-ring-color; outline-offset: -2p ...