现在的位置: 首页 > 综合 > 正文

Javascript:基本语句(if-else/switch/for/while/for-in/try-catch)

2018年01月08日 ⁄ 综合 ⁄ 共 2161字 ⁄ 字号 评论关闭

Javascript基本语法与C/Java非常相似,比较特殊的是,Javascript有一个for-in语句,可以用来遍历对象中的属性。

  <script>
    var person = {"name":"Bill Gates","age":56,"Country":"America"};
    var text = "";
    for (x in person){
      text+=(person[x]+",");  //使用person[x]取出person对象的x属性值
    }
    document.write(text)
  </script>

代码整理自w3school:http://www.w3school.com.cn

效果图:

代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Language" content="zh-cn" />

<title>Javascript 基本语句(if-else/switch/for/while/for-in/try-catch)</title>

<head>
  <style>
    body {background-color:#e5e5e5}
  </style>
</head>

<body>
  <h3>(一)if-else语句</h3>
  <p>点击按钮,显示当前是上午还是下午。</p>
  <button onclick = "timeNow()">确定</button>
  <p id = "timeText"></p>

  <script>
    function timeNow(){
      var x;
      var time = new Date().getHours();
      if (time<12){
        x = "上午";
      }else{
        x = "下午";
      }
      
      document.getElementById("timeText").innerHTML = x;
    }
  </script>

  <h3>(二)switch语句</h3>
  <p>点击按钮,显示当前是星期几</p>
  <button onclick = "weekdayNow()">确定</button>
  <p id = "weekdayText"></p>

  <script>
    function weekdayNow(){
      var x;
      var time = new Date().getDay();
      switch (time){
        case 0:
          x = "Sunday";
          break;
        case 1:
          x = "Monday";
          break;
        case 2:
          x = "Thesday";
          break;
        case 3:
          x = "Wendsday";
          break;
        case 4:
          x = "Thursday";
          break;
        case 5:
          x = "Friday";
          break;
        case 6:
          x = "Saturday";
          break;
        default:
          x = "Unknown";
          break;
      }
      
      document.getElementById("weekdayText").innerHTML = x;
    }
  </script>

  <h3>(三)for语句</h3>
  <script>
    var cars = ["BMW","Volvo","Saab"]
    for (var i =0;i<cars.length;i++){
      document.write(cars[i]+"<br/>");
    }
  </script>

  <h3>(四)for/in语句:遍历对象的属性</h3>
  <script>
    var person = {"name":"Bill Gates","age":56,"Country":"America"};
    var text = "";
    for (x in person){
      text+=(person[x]+",");  //使用person[x]取出person对象的x属性值
    }
    document.write(text)
  </script>

  <h3>(五)while语句</h3>
  <script>
    var i = 0;
    while(i<5){
      document.write("hello world-"+i+"<br/>");
      i++;
    }
  </script>

  <p>非boolean值作为while的条件:</p>
  <script>
    var cars = ["BMW","Volvo","Saab"]
    var i = 0;
    while(cars[i]){
      document.write("cars["+i+"]="+cars[i]+",");
      i++;
    }
  </script>

  <p>注:break,continue语句与C/java完全相同</p>

  <h3>(六)try-catch语句</h3>
  <button onclick = "errTest()">点击按钮</button>
  <script>
    function errTest(){
      try{
        alertttt("hello");
      }catch(err){
        var text = "网页上有一个错误。\n错误描述:";
        text+=err.message;
        alert(text)
      }
    }
  </script>
</body>

</html>

抱歉!评论已关闭.