html如何刷新图片

这是我一个随机生成图片的代码,如何设计一个按钮,刷新下边代码的图片,且不刷新整个页面

        <div class="picture">
            <center>
                <script language=javascript>
                    id=Math.floor(Math.random()*(336-1+1))+1;
                    document.write(" <img src=photo\\"+id+".jpg ")
                    </script>
            </center> 
        </div>
<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Login</title>
        <link rel="stylesheet" type="text/css" href="Login.css" />
    </head>
    <body>
        <button onclick="load()"></button>
    </body>
    <script language=javascript>
        load();

        function load() {
            id = Math.floor(Math.random() * (336 - 1 + 1)) + 1;
                        var img = document.createElement("img");
                        img.str = "photo\" + id + ".jpg";
                        document.body.appendChild(img); 
        }
    </script>
</html>

模拟点击按钮删除原来的显示再调用一下这个方法

封装成一个函数。点击运行。下面是大概代码。可能单词拼写有问题。你参照一下

 <div class="picture">
            <center>
                <script language=javascript>
                 var picture=docuument.getElementByClassName("picture")[0];
                     picture.addlistener("click",()=>{ //或者直接onclick。
                  imgRandom ();
                 })
                function imgRandom (){
                     var id=Math.floor(Math.random()*(336-1+1))+1;
                    document.write(" <img src=photo\\"+id+".jpg ")
}
                    </script>
            </center> 
        </div>

代码楼上几位大佬都给了,我就不献丑了,我只想知道336后面的-1+1有啥用?

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Login</title>
    </head>
    <body>
        <button class="picture"></button>
    </body>
    <div class="picture">
        <center>
            <script language=javascript>
             var picture=docuument.getElementByClassName("picture")[0];
                 picture.addlistener("click",()=>{ //或者直接onclick。
              imgRandom ();
             })
            function imgRandom (){
                 var id=Math.floor(Math.random()*(336-1+1))+1;
                document.write(" <img src=photo\\"+id+".jpg ")
}
                </script>
        </center> 
    </div>

    </script>
</html>