編寫方法

計(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 + '&nbsp;&nbsp;&nbsp;&nbsp;')  
   }
   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`;
      }
    }
  })
}
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末垂寥,一起剝皮案震驚了整個(gè)濱河市漠秋,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌靶橱,老刑警劉巖,帶你破解...
    沈念sama閱讀 222,681評(píng)論 6 517
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異拱镐,居然都是意外死亡,警方通過查閱死者的電腦和手機(jī)持际,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 95,205評(píng)論 3 399
  • 文/潘曉璐 我一進(jìn)店門沃琅,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人选酗,你說我怎么就攤上這事阵难。” “怎么了芒填?”我有些...
    開封第一講書人閱讀 169,421評(píng)論 0 362
  • 文/不壞的土叔 我叫張陵呜叫,是天一觀的道長。 經(jīng)常有香客問我殿衰,道長朱庆,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 60,114評(píng)論 1 300
  • 正文 為了忘掉前任闷祥,我火速辦了婚禮娱颊,結(jié)果婚禮上傲诵,老公的妹妹穿的比我還像新娘。我一直安慰自己箱硕,他們只是感情好拴竹,可當(dāng)我...
    茶點(diǎn)故事閱讀 69,116評(píng)論 6 398
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著剧罩,像睡著了一般栓拜。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上惠昔,一...
    開封第一講書人閱讀 52,713評(píng)論 1 312
  • 那天幕与,我揣著相機(jī)與錄音,去河邊找鬼镇防。 笑死啦鸣,一個(gè)胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的来氧。 我是一名探鬼主播诫给,決...
    沈念sama閱讀 41,170評(píng)論 3 422
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢(mèng)啊……” “哼饲漾!你這毒婦竟也來了蝙搔?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 40,116評(píng)論 0 277
  • 序言:老撾萬榮一對(duì)情侶失蹤考传,失蹤者是張志新(化名)和其女友劉穎吃型,沒想到半個(gè)月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體僚楞,經(jīng)...
    沈念sama閱讀 46,651評(píng)論 1 320
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡勤晚,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 38,714評(píng)論 3 342
  • 正文 我和宋清朗相戀三年,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了泉褐。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片赐写。...
    茶點(diǎn)故事閱讀 40,865評(píng)論 1 353
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡,死狀恐怖膜赃,靈堂內(nèi)的尸體忽然破棺而出挺邀,到底是詐尸還是另有隱情,我是刑警寧澤跳座,帶...
    沈念sama閱讀 36,527評(píng)論 5 351
  • 正文 年R本政府宣布端铛,位于F島的核電站,受9級(jí)特大地震影響疲眷,放射性物質(zhì)發(fā)生泄漏禾蚕。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 42,211評(píng)論 3 336
  • 文/蒙蒙 一狂丝、第九天 我趴在偏房一處隱蔽的房頂上張望换淆。 院中可真熱鬧哗总,春花似錦、人聲如沸倍试。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,699評(píng)論 0 25
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽易猫。三九已至耻煤,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間准颓,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 33,814評(píng)論 1 274
  • 我被黑心中介騙來泰國打工棺妓, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留攘已,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 49,299評(píng)論 3 379
  • 正文 我出身青樓怜跑,卻偏偏與公主長得像样勃,于是被迫代替她去往敵國和親。 傳聞我的和親對(duì)象是個(gè)殘疾皇子性芬,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,870評(píng)論 2 361