首页 > 代码库 > switch语句
switch语句
CreateTime--2017年7月13日08:40:07
Author:Marydon
switch语句
参考链接：http://www.w3school.com.cn/js/pro_js_statements_switch.asp
switch 语句是 if 语句的兄弟语句。
一、switch语句介绍
语法：
switch (expression) case value: statement; break; case value: statement; break; case value: statement; break; case value: statement; break;... case value: statement; break; default: statement;
说明：
每个情况（case）都是表示“如果 expression 等于 value，就执行 statement”。
关键字 break 会使代码跳出 switch 语句。如果没有关键字 break，代码执行就会继续进入下一个 case。
关键字 default 说明了表达式的结果不等于任何一种情况时的操作（事实上，它相对于 else 从句）。
switch 语句主要是为避免让开发者编写下面的代码：
if (i == 20) alert("20");else if (i == 30) alert("30");else if (i == 40) alert("40");else alert("other");
等价的 switch 语句是这样的：
switch (i) { case 20: alert("20"); break; case 30: alert("30"); break; case 40: alert("40"); break; default: alert("other");}
举例1：
CSS部分
/* 医嘱：长嘱，临嘱，中医样式显示 Start*/.yz_td1 { line-height: 28px; height: 28px; padding-left: 10px; width: 100px;}/*灰色背景色*/.yz_td2 { font-size: 14px; height: 28px; line-height: 28px; width: 100px; color: #333; margin: 4px; background: #e7e9e6; border-radius: 6px; text-align: center;}/*绿色背景色*/.yz_td3 { font-size: 14px; height: 28px; line-height: 28px; width: 100px; color: #fff; margin: 4px; background: #42b012; border-radius: 6px; text-align: center;}/* End 医嘱：长嘱，临嘱，中医嘱样式显示*/
HTML部分
<table cellspacing="0" cellpadding="1" border="0" class="medical_table" width="100%" height="100%"> <tbody> <tr> <td class="yz_td1">查看医嘱</td> <td width="100"> <div class="yz_td3" onclick="ctrlYzTitle(‘yzOption1‘);" id="yzOption1">长嘱</div> </td> <td width="100"> <div class="yz_td2" onclick="ctrlYzTitle(‘yzOption2‘);" id="yzOption2">临嘱</div> </td> <td width="100"> <div class="yz_td2" onclick="ctrlYzTitle(‘yzOption4‘);" id="yzOption3">中医</div> </td> <td></td><!-- 空td不要删除 --> </tr> </tbody></table>
JS部分
/** * 控制医嘱类型显示内容 */function ctrlYzTitle(senderId) { switch (senderId) { case ‘yzOption1‘: document.getElementById(‘yzOption1‘).className = ‘yz_td3‘; document.getElementById(‘yzOption2‘).className = ‘yz_td2‘; document.getElementById(‘yzOption3‘).className = ‘yz_td2‘; break; case ‘yzOption2‘: document.getElementById(‘yzOption2‘).className = ‘yz_td3‘; document.getElementById(‘yzOption1‘).className = ‘yz_td2‘; document.getElementById(‘yzOption3‘).className = ‘yz_td2‘; break; case ‘yzOption3‘: document.getElementById(‘yzOption3‘).className = ‘yz_td3‘; document.getElementById(‘yzOption1‘).className = ‘yz_td2‘; document.getElementById(‘yzOption2‘).className = ‘yz_td2‘; break; default: break; } }
实现效果：选中变色
效果展示：
举例2：巧用break特性
switch (panelId) { case ‘panel2‘:// 患者信息 case ‘panel4‘:// 专家选择 if(‘0‘ == panelStatus) return; case ‘panel3‘:// 病历信息 if(‘0‘ == panelStatus || ‘3‘ == panelStatus) return; }
二、ECMAScript 和 Java 中的 switch 语句
ECMAScript 和 Java 中的 switch 语句有两点不同：
在 ECMAScript 中，switch 语句可以用于字符串，而且能用不是常量的值。
举例：
var BLUE = "blue", RED = "red", GREEN = "green";switch (sColor) { case BLUE: alert("Blue"); break; case RED: alert("Red"); break; case GREEN: alert("Green"); break; default: alert("Other");}
解说：switch 语句用于字符串 sColor，声明 case 使用的是变量 BLUE、RED 和 GREEN，这在 ECMAScript 中是完全有效的。
switch语句
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。