外层为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. idea集成maven

    1 下载maven并解压 至 http://archive.apache.org/dist/maven/maven-3/下载zip包,下载后的包如下: 解压到安装目录下:如:D:\software,解 ...

  2. iOS 抓包

    通过tcpdump对iOS进行流量分析(无需越狱 iOS Packet Tracing 将 iOS 设备通过 USB 连接到 Mac 打开 terminal rvictl -s $UDID 运行 tc ...

  3. vue-cli脚手架项目按需引入elementUI

    https://www.jianshu.com/p/40da0ba35ac1 Couldn't find preset "es2015" relative to directory ...

  4. Python环境搭建详解(Window平台)

    前言 Python,是一种面向对象的解释型计算机程序设计语言,是纯粹的自由软件,Python语法简洁清晰,特色是强制用空白符作为语句缩进,具有丰富和强大的库,它常被称为胶水语言. Python是一种解 ...

  5. IDEA快捷键整理

                                                                              IDEA快捷键整理 一.修改快捷键方法: 点击 Fi ...

  6. WCF绑定netTcpBinding寄宿到IIS

    继续沿用上一篇随笔中WCF服务类库 Wettery.WcfContract.Services WCF绑定netTcpBinding寄宿到控制台应用程序 服务端 添加WCF服务应用程序 Wettery. ...

  7. 使用autogen生成应用程序遇到问题及解决方法

    从github上下载的代码,运行autogen.sh的时候,上报错误: $ ./autogen.sh --prefix=/usr./autogen.sh: 10: ./autogen.sh: auto ...

  8. HoloLens开发手记 - 使用配件 Working with accessories

    HoloLens提供了通过蓝牙使用配件的能力.使用附件两种常见情况是用来点击手势和虚拟键盘.对本文来讲,两个最常见的配件就是HoloLens Clicker(点击器)和蓝牙键盘.HoloLens包含了 ...

  9. 根据iPhone6设计稿动态计算rem值

    rem 单位在做移动端的h5开发的时候是最经常使用的单位.为解决自适应的问题,我们需要动态的给文档的更节点添加font-size 值.使用mediaquery 可以解决这个问题,但是每一个文件都引用一 ...

  10. Spring Cloud OAuth2.0 微服务中配置 Jwt Token 签名/验证

    关于 Jwt Token 的签名与安全性前面已经做了几篇介绍,在 IdentityServer4 中定义了 Jwt Token 与 Reference Token 两种验证方式(https://www ...