夜光带你走进JavaScript（十五）擅长的领域

最新推荐文章于 2019-12-01 20:35:23 发布

GeniusTeam-夜光

最新推荐文章于 2019-12-01 20:35:23 发布

阅读量127

点赞数

分类专栏： Genius-JavaScript

本文链接：https://blog.csdn.net/weixin_41987706/article/details/102572499

版权

Genius-JavaScript 专栏收录该内容

59 篇文章 2 订阅

订阅专栏

夜光序言：

两颗心注定会变成单数，不是太拥挤就是太孤独。

正文：嗯唔，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&lt;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 时执行的代码

GeniusTeam-夜光

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
夜光带你走进JavaScript（十五）擅长的领域

夜光序言：两颗心注定会变成单数，不是太拥挤就是太孤独。正文：嗯唔，JavaScript 比较和逻辑运算符比较和逻辑运算符用于测试 true 或者 false。比较运算符比较运算符在逻辑语句中使用，以测定变量或值是否相等。x=1111，下面的表格解释了比较运算符：<!DOCTYPE htm...
复制链接

扫一扫