Detailed graphic explanation of the usage and examples of JS ternary (ternary) operator-JS Tutorial-php.cn

Detailed graphic explanation of the usage and examples of JS ternary (ternary) operator

yulia

Release： 2018-10-12 11:37:04

Original

15839 people have browsed it

JavaScript is often used in front-end development, so do you know how to use the JS ternary operator? This article will tell you about the usage of JS ternary operator and how to use ternary operator to find the maximum value. It has certain reference value. Interested friends can refer to it.

The ternary operator in JavaScript, also called the ternary operator, is one of the operators.

The basic syntax is: expression ? sentence1 : sentence2

means that when the value of expression is true, sentence1 will be executed, otherwise sentence2 will be executed

Note: Because the JS script interpreter uses the semicolon ";" as the end mark of the statement, statementA and statementB must be a single statement, and semicolons cannot be used, otherwise an error will be reported.

Example: Using the ternary operator to implement, when the age is less than 18, it prompts to reject minors, when the age is greater than or equal to 18, it prompts that adults can participate. The code is as follows:

<!DOCTYPE html>
<html>
 <head>
  <meta charset="UTF-8">
  <title></title>
 </head>
 <body>
  <input id="age" value="18" />
  <button onclick="myFunction()">点我</button>
  <p id="demo"></p>
 </body>
 <script type="text/javascript">
  function myFunction() {
      var age,join;
      age = document.getElementById("age").value;
      join = (age < 18) ? "拒绝未成年人":"成年人可以参加";
      document.getElementById("demo").innerHTML = join ;
  }
 </script>
</html>

Copy after login

Example demonstration: Ternary operator to find the maximum value

This example involves the usage of multi-condition ternary operator. The specific code is as follows:

<!DOCTYPE html>
<html>
 <head>
  <meta charset="UTF-8">
  <title></title>
 </head>
 <body>
  <input type="text" id="inp1">
  <input type="text" id="inp2">
  <input type="text" id="inp3">
  <input type="button" value="判断" onclick="test()">
 </body>
 <script type="text/javascript">
  function test(){
        var inp1 = document.getElementById(&#39;inp1&#39;).value;
        var inp2 = document.getElementById(&#39;inp2&#39;).value;
        var inp3 = document.getElementById(&#39;inp3&#39;).value;
        var result = inp1>inp2?(inp1>inp3?inp1:inp3):(inp2>inp3?inp2:inp3);
        alert(result)
   }
 </script>
</html>

Copy after login

Rendering:

Detailed graphic explanation of the usage and examples of JS ternary (ternary) operator The above introduces the usage of the ternary operator in JS and how to use the ternary operator to find the maximum value. It is relatively simple. Just remember the syntax structure. , novices can try it themselves, I hope this article can help you! For more related tutorials, please visit JavaScript Video Tutorial

The above is the detailed content of Detailed graphic explanation of the usage and examples of JS ternary (ternary) operator. For more information, please follow other related articles on the PHP Chinese website!