如何打开网页就是全屏的效果

img


在网页中，我试过在body里调用js函数，然而并没有效果，我的问题是:在网页中，我应该如何做，才能打开网页就实现全屏的效果

需要确保在页面加载完成后才调用全屏方法

<!DOCTYPE html>
<html>
<head>
  <title>全屏示例</title>
</head>
<body>

  <h1>欢迎来到全屏示例页面</h1>
  
  <script>
    // 监听 window 的 load 事件
    window.addEventListener('load', function() {
      // 获取 document 对象
      const doc = document.documentElement;

      // 如果当前 document 不在全屏模式下，则请求进入全屏模式
      if (doc.requestFullscreen) {
        doc.requestFullscreen();
      } else if (doc.mozRequestFullScreen) {
        doc.mozRequestFullScreen();
      } else if (doc.webkitRequestFullScreen) {
        doc.webkitRequestFullScreen();
      }
    });
  </script>

</body>
</html>
  • 你可以参考下这个问题的回答, 看看是否对你有帮助, 链接: https://ask.csdn.net/questions/7464303
  • 除此之外, 这篇博客: 本地写网页的时用自动刷新代码实时同步查看网页效果中的 2. 在 <body>里 添加js, 实现刷新, 单位毫秒 部分也许能够解决你的问题, 你可以仔细阅读以下内容或跳转源博客中阅读:
  • <script language="JavaScript">
function myrefresh(){
   window.location.reload();
}
setTimeout('myrefresh()',1000); // 单位毫秒
</script>

    不过写网页还是要用 vscode, 不愧是前端神器, 再加上些标签的增强插件, 那真绝了, live server 可以实现上述刷新功能, 以保存自动一刷新, 其他插件不介绍了