夜光序言:
两颗心注定会变成单数,不是太拥挤就是太孤独。
正文:嗯唔,JavaScript 比较 和 逻辑运算符
比较和逻辑运算符用于测试 true 或者 false。
比较运算符
比较运算符在逻辑语句中使用,以测定变量或值是否相等。
x=1111,下面的表格解释了比较运算符:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>夜光</title>
</head>
<body>
<p>x=5, 返回 x==8 的比较值结果</p>
<button onclick="myFunction()">尝试一下</button>
<p id="demo"></p>
<script>
function myFunction()
{
var x=5;
document.getElementById("demo").innerHTML=x==8;
}
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>夜光</title>
</head>
<body>
<p>x=5, 返回 x==="5" 的比较值结果。</p>
<button onclick="myFunction()">尝试一下</button>
<p id="demo"></p>
<script>
function myFunction()
{
var x=5;
document.getElementById("demo").innerHTML=x==="5";
}
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>夜光</title>
</head>
<body>
<p>x=1111, 返回 x!=8 的比较值结果。</p>
<button onclick="myFunction()">尝试一下</button>
<p id="demo"></p>
<script>
function myFunction()
{
var x=1111;
document.getElementById("demo").innerHTML=x!=8;
}
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>夜光</title>
</head>
<body>
<p>x=5, 返回 x<8 的比较值结果。</p>
<button onclick="myFunction()">尝试一下</button>
<p id="demo"></p>
<script>
function myFunction()
{
var x=5;
document.getElementById("demo").innerHTML=x<8;
}
</script>
</body>
</html>
如何使用
可以在条件语句中使用比较运算符对值进行比较,然后根据结果来采取行动:
if (age<18) x="Too young";
逻辑运算符
逻辑运算符用于测定变量或值之间的逻辑。
给定 x=6 以及 y=3,下表解释了逻辑运算符:
运算符 | 描述 | 例子 |
---|---|---|
&& | and | (x < 10 && y > 1) 为 true |
|| | or | (x==5 || y==5) 为 false |
! | not | !(x==y) 为 true |
条件运算符
JavaScript 还包含了基于某些条件对变量进行赋值的条件运算符。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>夜光</title>
</head>
<body>
<p>靓仔靓女~~ 点击按钮检测年龄</p>
年龄:<input id="age" value="18" />
<p>是否达到投票年龄?</p>
<button onclick="myFunction()">点击按钮</button>
<p id="demo"></p>
<script>
function myFunction()
{
var age,voteable;
age=document.getElementById("age").value;
voteable=(age<18)?"年龄太小":"靓仔靓女~~年龄已达到";
document.getElementById("demo").innerHTML=voteable;
}
</script>
</body>
</html>
JavaScript if...Else 语句
条件语句用于基于不同的条件来执行不同的动作。
条件语句
通常在写代码时,您总是需要为不同的决定来执行不同的动作。您可以在代码中使用条件语句来完成该任务。
在 JavaScript 中,我们可使用以下条件语句:
- if 语句 - 只有当指定条件为 true 时,使用该语句来执行代码
- if...else 语句 - 当条件为 true 时执行代码,当条件为 false 时执行其他代码
- if...else if....else 语句- 使用该语句来选择多个代码块之一来执行
- switch 语句 - 使用该语句来选择多个代码块之一来执行
if 语句
只有当指定条件为 true 时,该语句才会执行代码。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>夜光</title>
</head>
<body>
<p>嗯唔~~ 如果时间早于 20:00,会获得问候 "Good day"</p>
<button onclick="myFunction()">点击这里</button>
<p id="demo"></p>
<script>
function myFunction(){
var x="";
var time=new Date().getHours();
if (time<20){
x="Good day~~";
}
document.getElementById("demo").innerHTML=x;
}
</script>
</body>
</html>
if...else 语句
请使用 if....else 语句在条件为 true 时执行代码,在条件为 false 时执行其他代码。
语法
if (condition)
{
当条件为 true 时执行的代码
}
else
{
当条件不为 true 时执行的代码