当前位置：首页 > article >正文

网站开发基础：JavaScript

article 2024/10/4 17:11:37

前端开发主要使用的技术如 HTML、CSS 和 JavaScript 等。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>

    <style>
        .myDivClass{border: solid red 1px;width: 50px;height: 50px;}
    </style>
</head>
<body>

    <button onclick="myJS()">点击我</button>
    <div id="myDiv" class="myDivClass"></div>

    <script>
        var my_x=0;
        function myJS(){
            my_x=my_x+50;
            document.getElementById("myDiv").style.marginLeft=my_x+"px";
        }
    </script>

</body>
</html>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>

    <style>
        .myDivClass{border: solid red 1px;width: 50px;height: 50px;}
    </style>
</head>
<body>

    <button onclick="myJS()">点击我</button>
    <div id="myDiv" class="myDivClass"></div>
    <div  class="myDivClass" style="width: 100px"></div>
    <script>
        var my_x=0;
        function myJS(){
            my_x=my_x+50;
            document.getElementById("myDiv").style.marginLeft=my_x+"px";
        }
    </script>

</body>
</html>