怎样用js实现每次点击按钮都使div向右移动50px?
2个回答
推荐于2019-09-12 · 知道合伙人互联网行家
关注
展开全部
HTML部分
//要移动的div(操作的对象)
<div class="test" style="background:#f00;width:100px;height:100px;"></div>
//按钮来触发事件
<input type="button" value="移动" id="move"/>
原生js实现
var btn_click=document.getElementById("move"); //获取点击按钮
var box=document.querySelector(".test");//获取要移动的div
var a=0;
btn_click.onclick=function(){
a=a+50;
box.style.left=a+'px'; //每点击一次,向右移动50px
}
//要移动的div(操作的对象)
<div class="test" style="background:#f00;width:100px;height:100px;"></div>
//按钮来触发事件
<input type="button" value="移动" id="move"/>
原生js实现
var btn_click=document.getElementById("move"); //获取点击按钮
var box=document.querySelector(".test");//获取要移动的div
var a=0;
btn_click.onclick=function(){
a=a+50;
box.style.left=a+'px'; //每点击一次,向右移动50px
}
展开全部
<body>
<!-- //要移动的div(操作的对象) -->
<div class="test" style="background:#f00;width:100px;height:100px;"></div>
<!-- 按钮来触发事件 -->
<input type="button" value="移动" id="move"/>
<!-- 原生js实现 -->
<script>
var btn = document.getElementById("move"); //获取点击按钮
var box = document.querySelector(".test");//获取要移动的div
var a = 0;
btn.onclick = function(){
a = a + 50;
box.style.marginLeft = a + 'px'; //每点击一次,向右移动50px
}
</script>
<!-- //要移动的div(操作的对象) -->
<div class="test" style="background:#f00;width:100px;height:100px;"></div>
<!-- 按钮来触发事件 -->
<input type="button" value="移动" id="move"/>
<!-- 原生js实现 -->
<script>
var btn = document.getElementById("move"); //获取点击按钮
var box = document.querySelector(".test");//获取要移动的div
var a = 0;
btn.onclick = function(){
a = a + 50;
box.style.marginLeft = a + 'px'; //每点击一次,向右移动50px
}
</script>
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询