通过JavaScript自动刷新页面

< Cami >

已于 2024-05-07 00:38:52 修改

阅读量244

点赞数 1

分类专栏：前端文章标签： javascript

于 2024-05-06 13:40:39 首次发布

本文链接：https://blog.csdn.net/qq_62563725/article/details/138491918

版权

前端专栏收录该内容

8 篇文章 0 订阅

订阅专栏

本文介绍了如何在JavaScript中使用location.reload()函数实现页面刷新，通过示例展示了点击刷新按钮清除动态添加的文本，以及在数据库数据变化时的应用场景。同时提供了菜鸟教程和CSDN的相关参考资料。

摘要由CSDN通过智能技术生成

核心代码

location.reload();

代码说明

在JavaScript中使用以上代码，即可刷新页面。

其效果相当于点击了页面左上角的刷新按钮。

示例展示

当点击刷新按钮，发现所有添加的“你好”都消失了，即表示刷新成功

<!DOCTYPE html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <!-- 给该按钮绑定一个点击事件
    只要一点击该按钮，就立即执行“refresh()”函数 -->
    <button onclick="refresh()">点击刷新</button>
    <!-- 单词释义：refresh---刷新 -->

    <script>
        function refresh(){
            // 刷新页面
            location.reload();
        }

        // 设定一个定时器，每1000毫秒（即1秒），在屏幕上添加一个“你好”
        // 当点击刷新按钮，发现所有添加的“你好”都消失了，即表示刷新成功
        setInterval(function(){
            var body = document.getElementsByTagName("body")[0]
            body.innerHTML+=`你好！`
        },1000)
    </script>
</body>
</html>