Skip to content

Commit f3e8a7a

Browse files
csxiaoyaojianxiancsxiaoyaojianxian
committed
add a lot of files
1 parent b3d6df6 commit f3e8a7a

File tree

76 files changed

+3843
-4
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

76 files changed

+3843
-4
lines changed

‎01-事件.html‎

Lines changed: 43 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -19,8 +19,8 @@
1919
</style>
2020
</head>
2121
<body>
22-
<div id="box" onclick="fn()"></div>
23-
22+
<div id="box" onclick="fn()"></div>
23+
<button>事件监听</button>
2424
<script>
2525

2626
//1.【获取事件源】（document.getElementById("box")）
@@ -46,13 +46,15 @@
4646
alert(1);
4747
}
4848
//2.4.循环绑定事件
49+
/*
4950
var aArr = ul.getElementsByTagName("a");
5051
for(var i=0;i<aArr.length;i++){
5152
aArr[i].onclick = function () {
5253
//this指的是函数调用者，和i并无关系，所以不会出错
5354
img.src = this.href;//img.src = aArr[i].href;
5455
}
5556
}
57+
*/
5658

5759
//3.【常用事件类型】
5860
// onclick / ondblclick
@@ -75,8 +77,45 @@
7577
var aaa = document.getElementById("box");
7678
console.log(aaa);
7779
aaa.style.width = "100px";
78-
79-
80+
81+
/**
82+
* 5.【事件监听】
83+
*/
84+
var btn = document.getElementsByTagName("button")[0];
85+
EventListen = {
86+
addEvent: function (ele,fn,str) {
87+
//通过判断调用的方式兼容IE678
88+
//判断浏览器是否支持该方法，如果支持那么调用，如果不支持换其他方法
89+
if(ele.addEventListener){
90+
//直接调用
91+
ele.addEventListener(str,fn);
92+
}else if(ele.attachEvent){
93+
ele.attachEvent("on"+str,fn);
94+
}else{
95+
//在addEventListener和attachEvent都不存在的情况下，用此代码
96+
ele["on"+str] = fn;
97+
}
98+
},
99+
removeEvent: function (ele,fn,str) {
100+
if(ele.removeEventListener){
101+
ele.removeEventListener(str,fn);
102+
}else if(ele.detachEvent){
103+
ele.detachEvent("on"+str,fn);
104+
}else{
105+
ele["on"+str] = null;
106+
}
107+
}
108+
}
109+
function fn1(){
110+
alert("事件1响应");
111+
}
112+
function fn2(){
113+
alert("事件2响应");
114+
}
115+
EventListen.addEvent(btn,fn1,"click");
116+
EventListen.addEvent(btn,fn2,"mouseout");
117+
EventListen.removeEvent(btn,fn2,"mouseout");
118+
80119
</script>
81120
</body>
82121
</html>

‎11-Date.html‎

Lines changed: 103 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,103 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head lang="en">
4+
<meta charset="UTF-8">
5+
<title></title>
6+
</head>
7+
<body>
8+
<span id="time"></span>
9+
<div></div>
10+
<script>
11+
/*
12+
month: 用英文表示月份名称，从January到December
13+
mth: 用整数表示月份，0~11
14+
dd: 表示一个月中的第几天，从1到31
15+
yyyy: 四位数表示的年份
16+
hh: 小时数，从0（午夜）到23（晚11点）
17+
mm: 分钟数，从0到59的整数
18+
ss: 秒数，从0到59的整数
19+
ms: 毫秒数，为大于等于0的整数
20+
21+
new Date("month dd,yyyy hh:mm:ss");
22+
new Date("month dd,yyyy");
23+
new Date(yyyy,mth,dd,hh,mm,ss);
24+
new Date(yyyy,mth,dd);
25+
new Date(ms);
26+
*/
27+
28+
//第一种，当前时间
29+
var date1 = new Date();
30+
console.log(date1);
31+
//第二种，指定时间
32+
var date2 = new Date("1993/11/28 00:00:00");
33+
console.log(date2);
34+
//第三种，兼容性不好，不推荐使用
35+
var date3 = new Date('Sun Nov 28 1993 00:00:00 GMT+0800 (中国标准时间)');
36+
console.log(date3);
37+
//第四种，兼容性不好，不推荐使用
38+
var date4 = new Date(1993,10,28);
39+
console.log(date4);
40+
41+
console.log(date1.getDate() ) //获取日 1-31
42+
console.log(date1.getDay () ) //获取星期 0-6（0代表周日）
43+
console.log(date1.getMonth () ) //获取月 0-11（1月从0开始）
44+
console.log(date1.getFullYear () ) //获取完整年份（浏览器都支持）
45+
console.log(date1.getHours () ) //获取小时 0-23
46+
console.log(date1.getMinutes () ) //获取分钟 0-59
47+
console.log(date1.getSeconds () ) //获取秒 0-59
48+
console.log(date1.getMilliseconds () ) //获取毫秒 （1s = 1000ms）
49+
console.log(date1.getTime () ) //返回累计毫秒数(从1970/1/1午夜)
50+
51+
//获取当前时间距离1970/01/01的毫秒值
52+
var date11 = Date.now();
53+
var date22 = +new Date();
54+
var date33 = new Date().getTime();
55+
var date44 = new Date().valueOf();
56+
console.log(date11);
57+
console.log(date22);
58+
console.log(date33);
59+
console.log(date44);
60+
61+
//日历
62+
var spanObj = document.getElementById("time");
63+
window.setInterval("getCurrentTime()",1000);
64+
function getCurrentTime(){
65+
var date = new Date();
66+
var timeInfo = date.getFullYear()+"年"+(date.getMonth()+1)+"月"+date.getDate()+"日 "+
67+
date.getHours()+":"+date.getMinutes()+":"+date.getSeconds();
68+
spanObj.innerHTML = timeInfo;
69+
}
70+
71+
//倒计时
72+
var div=document.getElementsByTagName("div")[0];
73+
var timer = setInterval(fn,1);
74+
function fn(){
75+
var nowtime = new Date();
76+
var future = new Date("2020/12/12 12:12:12");
77+
var timeSum = future.getTime() - nowtime.getTime();
78+
var day = parseInt(timeSum/1000/60/60/24);
79+
var hour = parseInt(timeSum/1000/60/60%24);
80+
var minu = parseInt(timeSum/1000/60%60);
81+
var sec = parseInt(timeSum/1000%60);
82+
var millsec = parseInt(timeSum%1000);
83+
day=day<10?"0"+day:day;
84+
hour=hour<10?"0"+hour:hour;
85+
minu=minu<10?"0"+minu:minu;
86+
sec=sec<10?"0"+sec:sec;
87+
if(millsec<10){
88+
millsec="00"+millsec;
89+
}else if(millsec<100){
90+
millsec="0"+millsec;
91+
}
92+
console.log(day);
93+
console.log(parseInt(timeSum/1000/60/60/24));
94+
if(timeSum<0){
95+
div.innerHTML="距离 2020/12/12 12:12:12 还有00天00小时00分00秒000毫秒";
96+
clearInterval(timer);
97+
return;
98+
}
99+
div.innerHTML="距离 2020/12/12 12:12:12 还有"+day+"天"+hour+"小时"+minu+"分"+sec+"秒"+millsec+"毫秒";
100+
}
101+
</script>
102+
</body>
103+
</html>

0 commit comments

Comments
 (0)