外层为false,逐级向内层判断

$scope.nums=700;
$scope.result=($scope.nums>300)?($scope.nums>400)?($scope.nums>500)?($scope.nums>600)?'飞机':'高铁':'汽车':'客车':'无';
console.log($scope.result);

运算符的简单使用小例子(开关按钮效果)

一、页面结构

<div id="div1" class="open1">
<div id="div2" class="open2"></div>
</div>

二、样式

#div1{
width: 170px;
height: 100px;
border-radius: 50px;
position: relative;
}
#div2{
width: 96px;
height: 96px;
border-radius: 48px;
position: absolute;
background: white;
box-shadow: 0px 2px 4px rgba(0,0,0,0.4);
}
.open1{
background: rgba(0,184,0,0.8);
}
.open2{
top: 1px;
right:0px;
}
.close1{
background: rgba(255,255,255,0.4);
border:3px solid rgba(0,0,0,0.15);
border-left: transparent;
}
.close2{
left: 0px;
top: 0px;
border:2px solid rgba(0,0,0,0.1);
}

三、事件方法

window.onload=function(){
var div2=document.getElementById("div2");
var div1=document.getElementById("div1");
div2.onclick=function(){
div1.className=(div1.className=="close1")?"open1":"close1";
div2.className=(div2.className=="close2")?"open2":"close2";
}
}

js 中三元运算符的运用的更多相关文章

  1. js中三元运算符的两种情况

    一.一般情况 <script type="text/javascript"> var b=5; (b == 5) ? a="true" : a=&q ...

  2. js中的运算符和条件语句

    js中的运算符大体上可以分为4类:1算术运算符.2一元操作符.3比较运算符.4逻辑运算符. 算术运算符一般指的是加减乘除求余这五种操作符:+,-,*,/,%.通过算术运算符可以对js中的变量进行操作. ...

  3. JavaScript 基础——使用js的三种方式,js中的变量,js中的输出语句,js中的运算符;js中的分支结构

    JavaScript 1.是什么:基于浏览器 基于(面向)对象 事件驱动 脚本语言 2.作用:表单验证,减轻服务器压力 添加野面动画效果 动态更改页面内容 Ajax网络请求 () 3.组成部分:ECM ...

  4. JS中的运算符和JS中的分支结构

    JS中的运算符 1.算术运算(单目运算符) + .-.*. /. %取余.++自增 .--自减 +:两种作用,链接字符串/加法运算.当+两边全为数字时,进行加法运算:当+两边有任意一边为字符串时,起链 ...

  5. 让你彻底搞懂JS中复杂运算符==

    让你彻底搞懂JS中复杂运算符== 大家知道,==是JavaScript中比较复杂的一个运算符.它的运算规则奇怪,容易让人犯错,从而成为JavaScript中“最糟糕的特性”之一. 在仔细阅读了ECMA ...

  6. JS中的运算符_函数学习

    js中的运算符:     算数运算符:     + - * / % ++ --          逻辑运算符:     & | !  && || < > <= ...

  7. js中的运算符优先级顺序

    js中运算符优先级从高到底的顺序: 算术操作符 → 比较操作符 → 逻辑操作符 → "="赋值符号

  8. JS中的运算符 以及变量和输入输出

    1.算术运算(单目运算符) + 加 .- 减.* 乘. / 除. % 取余.++ 自增.-- 自减. >>> +:有两种作用,链接字符串/加法运算,当+两边全为数字时,进行加法运算, ...

  9. 浅谈JS中逗号运算符的用法

    阅读本文的前提是,你能区分什么是表达式,什么是语句.还有明确运算符和运算数都是些啥东西.所谓的表达式就是一个JavaScript的"短语",JavaScript的解释器可以计算它, ...

随机推荐

  1. 第六篇: 分布式配置中心(Spring Cloud Config)

    一.简介 在分布式系统中,由于服务数量巨多,为了方便服务配置文件统一管理,实时更新,所以需要分布式配置中心组件. 在Spring Cloud中,有分布式配置中心组件spring cloud confi ...

  2. Java 9 被无情抛弃,Java 8 直接升级到 Java 10!!

    前几天写了一篇 Java 8 即将在 2019 年停止免费向企业提供更新的文章,企图迫使用户向更新一代的 Java 版本升级,但让人遗憾的是,小编今天收到了 Oracle Java 版本的升级推送,装 ...

  3. Autowired byType 与 byName 策略

    @Autowired是spring的注解,默认使用的是byType的方式向Bean里面注入相应的Bean.例如: @Autowiredprivate UserService userService;这 ...

  4. springboot创建统一异常拦截器全局处理 异常

    1.创建Exception类 public class MyException extends RuntimeException { private ErrorCodeEnum errorCode; ...

  5. Spark之submit任务时的Initial job has not accepted any resources; check your cluster UI to ensure that workers are registered and have sufficient memory

    Spark submit任务到Spark集群时,会出现如下异常: Exception 1:Initial job has not accepted any resources; check your ...

  6. 200. Orchard学习 目录

    201. Orchard学习 一.基础 210. Orchard学习 二.启动 211. Orchard学习 二 1.Application_Start 212. Orchard学习 二 2.Manu ...

  7. 关于const用法的学习

    被const修饰的东西都受到强制保护,可以预防意外的变动,能提高程序的健壮性.所以很多C++程序设计书籍建议:“Use const whenever you need”.1.const作函数参数 例如 ...

  8. quartz执行两遍问题

    转:http://blog.csdn.net/hejinwei_1987/article/details/49100975 在现在的项目中发现Quartz执行了两次,在网上找到下列解决方案,我是用的第 ...

  9. 【API知识】ElementUI一些问题的解决方案

    前言 本人并不是前端开发人员,不过前端的界面和交互也没少写.以下整理一下我在使用elementUI过程中遇到的问题和对应的解决方案. 正文 1.表格字段过长省略 elmentUI的table-colu ...

  10. jqgrid表头上面再加一行---二级表头

    实现效果如图,代码如下: $( "#table_list_1" ).jqGrid( 'setGroupHeaders' , { useColSpanStyle : true , / ...