Javascript 上边距或任何边距移动所有按钮，而不是一个按钮。请记住，我不能使用CSS，因为我使用的是webstorm解释器_Javascript_Html

Javascript 上边距或任何边距移动所有按钮，而不是一个按钮。请记住，我不能使用CSS，因为我使用的是webstorm解释器

javascript html

Javascript 上边距或任何边距移动所有按钮，而不是一个按钮。请记住，我不能使用CSS，因为我使用的是webstorm解释器,javascript,html,Javascript,Html,我试图在不移动其他元素的情况下单独移动每个按钮。如前所述，我的问题是，每次我使用margintop或marginleft时，它只会移动所有东西，每个botton。请记住，我不能使用CSS，因为我使用的是Jet Brains WebStorm。这是代码。这样你就能明白我在说什么了。修改margintop和marginleft值 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8

我试图在不移动其他元素的情况下单独移动每个按钮。如前所述，我的问题是，每次我使用margintop或marginleft时，它只会移动所有东西，每个botton。请记住，我不能使用CSS，因为我使用的是Jet Brains WebStorm。这是代码。这样你就能明白我在说什么了。修改margintop和marginleft值

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Gavito Auto</title>
</head>
<body>
<div id="button1">

</div>

<script>
    //Buttons
//// BUY CAR PARTS BUTTON

    function screen_main_button(name, func, moveX, moveY){
        // 1. Create the button

        var button = {};
        button.name = name;
        button.func = func;
        button.button = document.createElement("button");
        button.button.innerHTML = button.name;
        button.button.style.width = "200px";
        button.button.style.height = "200px";
        button.button.style.marginLeft = moveX;
        button.button.style.marginTop = moveY;
        button.button.style.backgroundColor = "orange";

        // 2. Append to body
        var body1 = document.getElementsByTagName("body")[0];
        body1.appendChild(button.button);

        // 3. Add event handler
        button.button.addEventListener ("click", function() {
           button.func()
        });
    }


    //BUTTON FUNCTIONS
    works = function(){
        alert("this is working")
    };

    //button calls
    screen_main_button("Buy Car Parts", works, "370px", "100px");
    screen_main_button("Buy A Car", works, "10px", "100px");
    screen_main_button("Request A Car Repair", works, "10px", "100px");

</script>
</body>
</html>


加维托汽车公司
//钮扣
////购买汽车零件按钮
功能屏幕\主\按钮（名称、功能、移动X、移动Y）{
//1.创建按钮
var按钮={}；
button.name=名称；
button.func=func；
button.button=document.createElement（“按钮”）；
button.button.innerHTML=button.name；
button.button.style.width=“200px”；
button.button.style.height=“200px”；
button.button.style.marginLeft=moveX；
button.button.style.marginTop=moveY；
button.button.style.backgroundColor=“橙色”；
//2.附加到正文中
var body1=document.getElementsByTagName（“body”）[0]；
body1.appendChild（button.button）；
//3.添加事件处理程序
button.button.addEventListener（“单击”，函数（）{
button.func（）
});
}
//按钮功能
works=函数（）{
警报（“这正在工作”）
};
//按钮呼叫
屏幕上的主按钮（“购买汽车零件”，工程，“370px”，“100px”）；
屏幕主按钮（“买车”，工作方式，“10px”，“100px”）；
屏幕主按钮（“请求汽车维修”，工作，“10px”，“100px”）；

这种行为的原因是按钮在HTML文档中以内联方式显示。如果您想在不干扰其他元素的情况下自由移动按钮，我建议您使用

位置

绝对

和

顶部

左侧

请记住，最后两个按钮位于彼此的顶部，因为它们具有相同的坐标


加维托汽车公司
//钮扣
////购买汽车零件按钮
功能屏幕\主\按钮（名称、功能、移动X、移动Y）{
//1.创建按钮
var按钮={}；
button.name=名称；
button.func=func；
button.button=document.createElement（“按钮”）；
button.button.innerHTML=button.name；
button.button.style.position=“绝对”；
button.button.style.width=“200px”；
button.button.style.height=“200px”；
button.button.style.left=moveX；
button.button.style.top=moveY；
button.button.style.backgroundColor=“橙色”；
//2.附加到正文中
var body1=document.getElementsByTagName（“body”）[0]；
body1.appendChild（button.button）；
//3.添加事件处理程序
button.button.addEventListener（“单击”，函数（）{
button.func（）
});
}
//按钮功能
works=函数（）{
警报（“这正在工作”）
};
//按钮呼叫
屏幕上的主按钮（“购买汽车零件”，工程，“370px”，“100px”）；
屏幕主按钮（“买车”，工作方式，“10px”，“100px”）；
屏幕主按钮（“请求汽车维修”，工作，“10px”，“100px”）；

“我不能使用CSS，因为我使用的是Jet Brains WebStorm”。你确定吗？我很想知道为什么会这样。