HTML DOM fullscreenEnabled() 方法

htmlweb developmentfront end technology更新于 2025/9/29 14:36:17

HTML DOM fullscreenEnabled() 方法用于指定当前文档是否支持全屏模式。其返回类型为布尔值，且为只读属性。如果支持全屏模式，则返回 True，否则返回 false。为了使其与您的浏览器兼容，我们使用了不同的前缀。

语法

以下是 fullscreenEnabled() 方法的语法 −

document.fullscreenEnabled()

我们来看一个 fullscreenEnabled() 方法 − 的示例。

注意 − 您需要使用您的浏览器前缀才能使 fullscreenEnabled() 方法正常工作。请查看最后的注释，了解您浏览器的特定前缀。

示例

让我们看一个例子 −

<!DOCTYPE html>
<html>
<body>
<h1>fullscreenEnabled() method</h1>
<p>Click the below button to know if this document can be viewed in full screen mode or not</p>
<button onclick="EnableFullScreen();">CHECK</button>
<p id="Sample"></p>
<script>
   function EnableFullScreen() {
      var FullS=(document.fullscreenEnabled || /* Standard syntax */
      document.webkitFullscreenEnabled) /* Chrome, Safari and Opera */
      if(FullS==true)
         document.getElementById("Sample").innerHTML="This document can be viewed in fullscreen mode.";
      else
         document.getElementById("Sample").innerHTML="This document cannot be viewed in fullscreen mode.";
   }
</script>
</body>
</html>

输出

这将产生以下输出 −

点击"CHECK"按钮时 −

在上面的例子中 −

我们首先创建了一个"CHECK"按钮，当用户点击该按钮时，它将执行 EnableFullScreen() 方法。

<button onclick="EnableFullScreen();>CHECK</button>

EnableFullScreen() 函数获取 document.FullScreenEnabled 属性值并将其赋值给变量 FullS。返回值可以是 true 或 false。然后，它会使用其 innerHTML 属性显示在 ID 为"Sample"的段落中。

function EnableFullScreen() {
   var FullS=(document.fullscreenEnabled || /* 标准语法 */
   document.webkitFullscreenEnabled) /* Chrome、Safari 和 Opera */
   if(FullS==true)
      document.getElementById("Sample").innerHTML="此文档可在全屏模式下查看。";
   else
      document.getElementById("Sample").innerHTML="此文档无法在全屏模式下查看。"
}

注意 − 我们已指定 fullscreenEnabled() 标准语法，适用于 Chrome、Safari 和 Opera 浏览器。如果您使用其他浏览器，请使用以下前缀。