js的screen对象

最新推荐文章于 2024-05-26 00:00:00 发布

_米粒儿_

最新推荐文章于 2024-05-26 00:00:00 发布

阅读量462

点赞数 1

分类专栏： Javascript 文章标签： history Location 页面跳转 screen

本文链接：https://blog.csdn.net/yiren_99/article/details/47843661

版权

Javascript 专栏收录该内容

25 篇文章 0 订阅

订阅专栏

screen对象

screen对象用于获取用户的屏幕信息。

语法：
window.screen.属性
对象属性:

屏幕分辨率的高和宽

window.screen 对象包含有关用户屏幕的信息。

1. screen.height 返回屏幕分辨率的高

2. screen.width 返回屏幕分辨率的宽

注意:

1.单位以像素计。

2. window.screen 对象在编写时可以不使用 window 这个前缀。
我们来获取屏幕的高和宽，代码如下:
<script type="text/javascript">
  document.write( "屏幕宽度："+screen.width+"px<br />" );
  document.write( "屏幕高度："+screen.height+"px<br />" );
</script>
屏幕可用高和宽度
1. screen.availWidth 属性返回访问者屏幕的宽度，以像素计，减去界面特性，比如任务栏。

2. screen.availHeight 属性返回访问者屏幕的高度，以像素计，减去界面特性，比如任务栏。

注意:

不同系统的任务栏默认高度不一样，及任务栏的位置可在屏幕上下左右任何位置，所以有可能可用宽度和高度不一样。

我们来获取屏幕的可用高和宽度，代码如下：
<script type="text/javascript">
document.write("可用宽度：" + screen.availWidth);
document.write("可用高度：" + screen.availHeight);
</script>
注意:根据屏幕的不同显示值不同。
编程练习

制作一个跳转提示页面：

要求：

1. 如果打开该页面后，如果不做任何操作则5秒后自动跳转到一个新的地址，如慕课网主页。

2. 如果点击“返回”按钮则返回前一个页面。

效果:

注意: 在窗口中运行该程序时，该窗口一定要有历史浏览记录，否则"返回"无效果。
<!DOCTYPE html>
<html>
 <head>
  <title>浏览器对象</title>  
  <meta http-equiv="Content-Type" content="text/html; charset=gkb"/>   
 </head>
 <body>
  
  <h2>操作成功</h2>
  <p><span id="sec">5</span>秒后回到主页<a href="#" οnclick="goBack()">返回</a></p> 
  
  <script type="text/javascript">  
    
   var second = 5;
   function timeCount(){
            document.getElementById("sec").innerHTML = second; 
            second = second - 1;
            setTimeout(timeCount,1000);
           if(second == 0){

         window.location.href="http://www.baidu.com";
            }
       }
   
   function goBack(){
       window.history.back();
   }
   
   setTimeout(timeCount,1000);
   
   //通过window的location和history对象来控制网页的跳转。
   
 </script> 
</body>
</html>

_米粒儿_

关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
js的screen对象

screen对象screen对象用于获取用户的屏幕信息。语法：window.screen.属性对象属性:屏幕分辨率的高和宽window.screen 对象包含有关用户屏幕的信息。1. screen.hei
复制链接

扫一扫