Este artigo descreve a estrutura básica do movimento JS. Compartilhe para sua referência. A análise específica é a seguinte:
Nota aqui:
1. Desligue o cronômetro existente ao iniciar o movimento
2. Movimento separado da parada
Copie o código da seguinte forma: <! Doctype html>
<html>
<head>
<meta charset = "utf-8">
<Title> </title>
<style type = "text/css">
#div1 {
Largura: 200px;
Altura: 200px;
Antecedentes: vermelho;
Posição: Absoluto;
Esquerda: 0;
topo: 60px;
}
</style>
<script type = "text/javascript">
window.onload = function () {
var odiv = document.getElementById ("div1");
var obt = document.getElementsByTagName ('input') [0];
var time = null;
obt.OnClick = function () {
ClearInterval (tempo); // O primeiro temporizador deve ser desligado aqui, porque isso é para resolver o bug em que vários botões são clicados durante o movimento, resultando em vários temporizadores sobrepostos.
time = setInterval (function () {
var velocidade = 7;
if (odiv.offsetleft <= 600)
odiv.style.left = odiv.offsetleft+velocidade+'px';
outro{
ClearInterval (tempo);
}
}, 30);
}
}
</script>
</head>
<Body>
<input type = "button" value = "Iniciar movimento" />
<div id = "div1"> </div>
</body>
</html>
Espero que este artigo seja útil para a programação JavaScript de todos.