計(jì)時(shí)器
<h1 id="time"></h1>
<script>
//倒計(jì)時(shí)
function countDown(year,m,d){
var time = new Date();//現(xiàn)在的時(shí)間
var futuretime = new Date(year,m,d);//未來截止時(shí)間
var nowmin = time.getTime();//現(xiàn)在的毫秒數(shù)
var futuremin = futuretime.getTime();//未來的毫秒數(shù)
var gap = futuremin - nowmin; //進(jìn)行相減,求出時(shí)間差
// console.log(gap);
var day = Math.floor(gap / 1000 / 60 /60 / 24);//天
var hour = Math.floor(gap / 1000 / 60 / 60 % 24);//時(shí)
var minute = Math.floor(gap / 1000 / 60 % 60);//分鐘
var seconds = Math.floor(gap / 1000 % 60);//秒
// console.log(seconds)
var str = `${day}天${hour}時(shí)${minute}分${seconds}秒`;
return str;
}
//8月
//獲取
var times = document.getElementById('time');
var timer = null;
timer = setInterval(function(){
times.innerHTML = countDown(2019,8,2);
},1000)
</script>
·
按鈕開關(guān)
<img src="./guan.png" alt="" id="img">
<button id="open">開燈</button>
<button id="close">關(guān)燈</button>
<script>
function getId(name) {
return document.getElementById(name);
}
var open = getId('open');
var close = getId('close');
var img = getId('img');
open.onclick = function () {
img.src = './liang.png';
img.style = 'width:140px;height:200px';
}
close.onclick = function () {
img.src = './guan.png';
img.style = 'width:140px;height:200px';
}
</script>
`
九九乘法表
for (i = 9; i >= 1; i--) {
for (g = 1; g <= i; g++) {
document.write(g + '*' + i + '=' + i * g + ' ')
}
document.write('<br>')
}
1到100 的偶數(shù)和
var a = 0
for (x = 0; x <= 100; x += 2) {
a += x
}
console.log(a) // 2550
輪播
var img_list = document.querySelectorAll('ul li');
var ol_li = document.querySelectorAll('ol li');
var box = document.getElementsByClassName('box')[0];
var left = document.getElementById('left');
var right = document.getElementById('right');
var timer = null;
var inder = 0;
timer = setInterval(auto, 1000);
function auto() {
inder++
if (inder > img_list.length - 1) {
inder = 0;
}
getThis()
}
function getThis() {
for (var i = 0; i < img_list.length; i++) {
img_list[i].style = 'display:none'
ol_li[i].className = ''
}
img_list[inder].style = 'display:block'
ol_li[inder].className = 'arr'
}
right.onclick = function () {
auto()
}
left.onclick =function(){
inder--
if (inder < 0) {
inder=img_list.length - 1
}
getThis()
}
for(var i =0 ;i<ol_li.length;i++){
ol_li[i].ind=i
ol_li[i].onmouseover=function(){
for(var f=0;f<ol_li.length;f++){
ol_li[f].className= ' '
}
ol_li[this.ind].className = 'arr';
inder = this.ind;//同步計(jì)時(shí)器的下標(biāo)
getThis();//排他
}
}
box.onmouseover = function () {
clearInterval(timer);
}
box.onmouseout = function () {
timer = setInterval(auto, 1000);
}
推拉門
var li_list = document.querySelectorAll('ul li');
//每個(gè)初始位置
for (var i = 0; i < li_list.length; i++) {
li_list[i].style = `left:${i * 50}px`;
}
for (var i = 0; i < li_list.length; i++) {
li_list[i].index = i;
//劃過每一項(xiàng)
li_list[i].addEventListener('mouseover', function () {
var ind = this.index;//當(dāng)前劃過的下標(biāo)剪芍,就是分水嶺
for (var j = 0; j < li_list.length; j++) {
if (j > ind) {//下標(biāo)前面的 動(dòng)
li_list[j].style = 'left:' + (600 + (50 * (j -1)))+'px';
} else {//下標(biāo)前面的不動(dòng)
li_list[j].style = `left:${j * 50}px`;
}
}
})
}