如何通过JavaScript重新触发WebKit CSS动画？

Question

因此，我有以下-webkit-animation规则：

@-webkit-keyframes shake {

    0% {

        left: 0;

    }

    25% {

        left: 12px;

    }

    50% {

        left: 0;

    }

    75% {

        left: -12px;

    }

    100% {

        left:0;

    }

}

还有一些CSS定义了我的一些动画规则box：

#box{

    -webkit-animation-duration: .02s;

    -webkit-animation-iteration-count: 10;

    -webkit-animation-timing-function: linear;

}

我可以shake在#box这样的：

document.getElementById("box").style.webkitAnimationName = "shake";

但是我以后不能再动摇了。

这只会摇晃盒子一次：

someElem.onclick = function(){

    document.getElementById("box").style.webkitAnimationName = "shake";

}

如何在不使用超时或多个动画的情况下通过JavaScript重新触发CSS动画？