javascript平时小例子④(setInterval使用2)

<!DOCTYPE html>
<html>

<head>
<meta charset="utf-8">
<title></title>
<style>
* {
margin: 0 auto;
}

#kaishi {
text-align: center;
background-color: red;
width: 300px;
height: 100px;
border: 1px solid black;
}
</style>
</head>

<body>
<div id="kaishi">
距离2017年还有
<br />
<input type="text" id="daojishi" / style="text-align: center;">
<script>
window.onload=function(){

setInterval(function() {

var time = new Date();
var year = time.getFullYear();
var month = time.getMonth() + 1;
var day = time.getDate();
var hours = time.getHours();
var minutes = time.getMinutes();
var secomds = time.getSeconds();
tian = 0;
if(month == 8 || month == 10 || month == 12) {
tian = 31;
} else if(month == 9 || month == 11) {
tian = 30;
}
document.getElementById("daojishi").value = (2017 - year - 1) + "年" + (12 - month - 1) + "月" + (tian - day - 1) + "日" + (24 - hours - 1) + "时" + (60 - minutes - 1) + "分" + (60 - secomds - 1) + "秒";
}, 1000);
}
</script>
</div>
</body>

</html>

时间: 2024-11-08 22:23:04

javascript平时小例子④(setInterval使用2)的相关文章

javascript平时小例子③(setInterval使用1)

<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <style> .lala{ text-align: center; } </style> </head> <body> <div class="lala"> <input type="

javascript平时小例子①(移动的小div)

css样式: #box{ width: 300px; height: 300px; background: deepskyblue; position: absolute; margin-right: 20px; }  html布局: <div id="box"></div> js部分: window.onload=function(){ abc(); setInterval(abc,50) function abc(){ var oDiv=document.g

javascript平时小例子⑧(导航置顶效果)

<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title></title> <style type="text/css"> *{ margin: 0;padding: 0; } .wrap{ width: 100%; height: 300px; position: relative; } .wrap .top{ wid

javascript平时小例子⑤(投票效果的练习)

<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <style> #dakuang { width: 1000px; height: 30px; } #left, #right { height: 100%; float: left; } #left { background-color: red; /*width:

javascript平时小例子②(正则表达式验证邮箱)

<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>邮箱正则</title> </head> <body> <input type="text" id="Txt1" /> <input type="button" value="提交&quo

javascript平时小例子⑦(鼠标跟随的div)

<!doctype html><html> <head> <meta charset="utf-8"> <title>无标题文档</title> <style> #div1 { width: 200px; height: 200px; background-color: #0F0; position: absolute } </style> <script> window.onl

JavaScript基础中的基础(小例子:滚动字幕)

一.变量 局部变量声明前面要加"var" <script type="text/javascript"> // 全局变量 name = 'alex'; function func(){ // 局部变量 var age = 18; // 修改全局变量name name = "eric" } </script> 二.数据类型 数据类型有:数字.字符串.布尔值      数组.字典 数字.字符串.布尔值.null.undefin

五个小例子教你搞懂 JavaScript 作用域问题

众所周知,JavaScript 的作用域和其他传统语言(类C)差别比较大,掌握并熟练运用JavaScript 的作用域知识,不仅有利于我们阅读理解别人的代码,也有助于我们编写自己的可靠代码. 下面笔者将使用五个小例子来给大家分析下 JavaScript 的作用域要注意的问题. 感谢 例子的来源 (这5个例子我做错了2个 [嘿嘿,尽情鄙视吧],笔者就是要 死磕自己,奉献大家!) 先给出五个例子: 每个例子旁边都会给出答案的链接,如果你全部都正确了,你可以忽略这篇短文,并深深的鄙视下笔者. 例一:

javascript 复合数据的定义和使用 ( 小例子 )

思路:主要是先要获取到三个 box 元素的 top 值 和 left 值,然后有复合数据进行存值,再进行数组值的位置移动来实现切换 box 位置效果: <!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title></title> </head> <style> #warp{margin:50p