Community Learn Tools Library Leisure
search
English
Home > List of blog posts > JS第3课-js对象和定时器-九期线上班
Blogger Information
Blog 31
fans 0
comment 0
visits 18238
Special Recommendation
More>
Related recommendations
Popular Tutorials
More>
Related Tutorials
Popular Recommendations
Latest courses
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
JS第3课-js对象和定时器-九期线上班
Content っ
Original
710 people have browsed it

1.js对象和定时器

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <title>js对象</title>
  6. </head>
  7. <body>
  9. <button name="send" id="send" onclick="send()">获取验证码</button>
  11. <script>
  12.     //定义对象
  14.     function func1() {
  15.         //第一种创建方式
  16.         var obj = new Object();
  17.         obj.name = 'jason';
  18.         obj.age = 18;
  19.         obj.func2 = function () {
  20.             console.log(this.name,this.age);
  21.         };
  22.         obj.func22= function (name,age) {
  23.             console.log(name,age);
  24.         };
  26.         //第二种创建方式
  27.         obj.func2();
  28.         console.log(obj);
  30.         var obj1 = {'name':'jack','age':15};
  31.         obj1.func3 = function(){
  32.             console.log(obj1.name,obj1.age);
  33.         };
  34.         obj1.func33 = function(){
  35.             obj.func22('li',1);
  36.         };
  37.         obj1.func3();
  38.         console.log(obj1);
  40.         var obj2 = {
  41.             'name':'liu',
  42.             'age':12,
  43.             objFunc:function () {
  44.                 console.log(name,age);
  45.             },
  46.         };
  47.         //调用
  48.         obj1.func33();
  49.         obj2.objFunc();
  51.     }
  53.     //匿名函数
  54.     function func2() {
  55.         //setTimeout的使用
  56.         setTimeout(function () {
  57.             console.log('3秒后运行');
  58.         },3000);
  60.         function timeFunc() {
  61.             console.log('5秒后运行timeFunc()');
  62.         }
  64.         setTimeout(timeFunc,5000);
  65.     }
  67.     // setInterval 使用
  68.     function func3() {
  70.         var f1 = setInterval( function () {
  71.             console.log('每三秒调用一次');
  72.             //删除定时器
  73.             clearInterval(f1);
  74.         },3000);
  76.         //5次后删除定时器
  77.         var count = 0;
  78.         var f2 = setInterval(function () {
  79.             count++;
  80.             console.log('每三秒调用一次'+count);
  81.             if (count == 5){
  82.                 clearInterval(f2);
  83.             }
  84.         },3000);
  85.     }
  87.     function send() {
  89.         var time = 10;
  90.         var f3 = setInterval(function () {
  91.             time--;
  92.             document.getElementById('send').textContent = time+'秒后重新获取';
  93.             if (time == 0){
  94.                 clearInterval(f3);
  95.                 document.getElementById('send').textContent = '重新获取';
  96.             }
  97.         },1000);
  98.     }
  101. </script>
  103. </body>
  104. </html>

总结
今天主要学习了对象的创建和使用，函数和匿名函数的使用，还有两种定时器的使用，很好用。

Correction status：Uncorrected

Teacher's comments：
Statement of this Website
The copyright of this blog article belongs to the blogger. Please specify the address when reprinting! If there is any infringement or violation of the law, please contact admin@php.cn Report processing!
All comments Speak rationally on civilized internet, please comply with News Comment Service Agreement
0 comments
Author's latest blog post