您好,欢迎访问一九零五行业门户网

jQuery实现电子时钟功能步骤详解

这次给大家带来jquery实现电子时钟功能步骤详解,jquery实现电子时钟功能的注意事项有哪些,下面就是实战案例,一起来看一下。
<!doctype html> <html>   <head>     <title>jquery电子时钟</title>     <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>   </head>   <body>     <span id="time">haha</span>     <script type="text/javascript">     window.onload = function(){       showtime();     }     function showtime(){     var mydate = new date();     var year = mydate.getfullyear();     var month = mydate.getmonth() + 1;     var date = mydate.getdate();     var dayarray = new array(7);     dayarray[0] = 星期日;     dayarray[1] = 星期一;     dayarray[2] = 星期二;     dayarray[3] = 星期三;     dayarray[4] = 星期四;     dayarray[5] = 星期五;     dayarray[6] = 星期六;     var day1 = mydate.getday();     var day = dayarray[day1];     var hour = mydate.gethours();     var minute = mydate.getminutes();     var second = mydate.getseconds();     var min = checktime(minute);     var sec = checktime(second);     var time1 = year + 年 + month + 月 + date + 日;     var time2 = hour + : + min + : + sec;     // document.write(time1+day+time2);     //用js方法     // document.getelementbyid(time).innerhtml = time1+day+time2;     //用jquery方法     $('#time').text(time1+day+time2);     settimeout(showtime(),500);     }     function checktime(i){       if(i<10){         i = 0 + i;       }       return i;     }     </script>   </body> </html>
运行效果:
实例小结:
1、注意js文件引用,要在head中声明,在body中展开时,无需重新申明引用信息等;
2、注意date有关函数,获取时候不要忘记了get和括号;
3、注意window.onload = function(){}的写法;
4、月份要注意数组开始顺序,从一月份开始,下标是0,以此类增;
5、注意时、分、秒函数为复数;
6、day表示获取星期几,但是获取的是数字,可以用数组转换(0表示周日,其它一一对应)
7、settimeout函数:settimeout(a,b),注意settimeout中out为小写
a:函数体 b:函数执行间隔
8、settimeout执行过程中,不要使用document.write,否则递归调用未实现;
9、jquery选择器中使用单引号还是双引号?
理论上单双都可以,在嵌套情况下视具体情况而定。
10、关于jquery获取标签文本内容:方法1:text();方法2:html();
注意,需要改变文本内容时,正确格式为:$('#time').text(content) 错误格式为:$('#time').text() = content
相信看了本文案例你已经掌握了方法,更多精彩请关注其它相关文章!
推荐阅读:
jquery遍历xml节点与属性实现步骤
vue波纹按钮组件使用详解
以上就是jquery实现电子时钟功能步骤详解的详细内容。
其它类似信息

推荐信息