Javascript：获取浏览器窗口和屏幕的可用宽高

最新推荐文章于 2022-04-27 15:10:15 发布

books1958

最新推荐文章于 2022-04-27 15:10:15 发布

阅读量1.3k

点赞数

分类专栏： html/css/javascript 文章标签： javascript

本文链接：https://blog.csdn.net/books1958/article/details/43667319

版权

html/css/javascript 专栏收录该内容

33 篇文章 0 订阅

订阅专栏

1.获取浏览器窗口的有效宽高（不包括工具栏和滚动条）

注：对于绝大部分浏览器使用window.innerWidth即可获取宽度，使用document.documentElement.clientWidth || document.body.clientWidth 为了实现对IE6，7的支持。

高度同上。

var w=window.innerWidth
  || document.documentElement.clientWidth
  || document.body.clientWidth;

  var h=window.innerHeight
  || document.documentElement.clientHeight
  || document.body.clientHeight;

  x=document.getElementById("screen_size");
  x.innerHTML="浏览器的内部窗口宽度：" + w + "，高度：" + h + "。"

2.获取屏幕的有效宽高

document.write("屏幕可用尺寸，宽:" + screen.availWidth+"，高:"+screen.availHeight);

3.location相关（获取web服务器相关信息）

    document.write("web 主机的域名: "+location.hostname+"<br/>");
    document.write("当前页面的路径和文件名: "+location.pathname+"<br/>");
    document.write("web 主机的端口: "+location.port+"<br/>");
    document.write("所使用的 web 协议: "+location.protocol+"<br/>");
    document.write("当前页面的url: "+location.href+"<br/>");