VIP26/day13/js/3.小例子.js

var box = document.querySelector(".box");
var btn1 = document.getElementById("btn1");
var btn2 = document.getElementById("btn2");

btn1.onclick = function() {
    var timer1 = setInterval(function(){
        if (box.offsetWidth >= 250) {
            clearInterval(timer1);
        } else {
            box.style.width = box.offsetWidth + 10 + 'px'
        }
    },1000)
}

box.onclick = function() {
    console.log(box.offsetWidth,'宽度')

}

btn2.onclick = function() {
    var timer2 = setInterval(function(){
        if(box.offsetWidth <= 200) {
            clearInterval(timer2);
            console.log(box.offsetWidth)   
        } else {
            box.style.width = box.offsetWidth - 10 + 'px';
        }
    },1000)
}