pc端: 

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

移动端:  

 网页可见区域宽:document.body.clientWidth
 网页可见区域高:document.body.clientHeight
 网页可见区域宽:document.body.offsetWidth (包括边线的宽)
 网页可见区域高:document.body.offsetHeight (包括边线的宽)
 网页正文全文宽:document.body.scrollWidth
 网页正文全文高:document.body.scrollHeight
 网页被卷去的高:document.body.scrollTop
 网页被卷去的左:document.body.scrollLeft
 网页正文部分上:window.screenTop
 网页正文部分左:window.screenLeft
 屏幕分辨率的高:window.screen.height
 屏幕分辨率的宽:window.screen.width
 屏幕可用工作区高度:window.screen.availHeight
 屏幕可用工作区宽度:window.screen.availWidth 例:

<script type="text/javascript">
  var w = window.innerWidth
  || document.documentElement.clientWidth //获取pc的宽,一般在pc上调试的时候用
  || document.body.clientWidth;
  var h = window.innerHeight
  || document.documentElement.clientHeight  //获取pc的高
  || document.body.clientHeight;

  var w1 = window.screen.width  //获取手机屏幕的宽 ,在实际上线的时候使用

  window.onload = function(){
    if(w < 415){
      window.location.assign('tf/index.html');
    }else{
      window.location.assign('sh/index.html');
    }

    if(w1 < 415){
      window.location.assign('tf/index.html');
    }else{
      window.location.assign('sh/index.html');
    }

  }

</script>



原生js获取pc和移动端屏幕宽、高的方法的更多相关文章

  1. 原生JS 获取浏览器、窗口、元素等尺寸的方法及注意事项

    一.通过浏览器获得屏幕的尺寸 screen.width screen.height screen.availHeight //获取去除状态栏后的屏幕高度 screen.availWidth //获取去 ...

  2. js获取图片信息(二)-----js获取img的height、width宽高值为0

    首先,创建一个图片对象: var oImg= new Image(); oImg.src = "apple.jpg"; 然后我们打印一下图片的信息: console.log(oIm ...

  3. android获取屏幕宽高与获取控件宽高

    获取屏幕宽高 // 获取屏幕宽高(方法1) int screenWidth = getWindowManager().getDefaultDisplay().getWidth(); // 屏幕宽(像素 ...

  4. 原生js获取鼠标坐标方法全面讲解-zmq

    原生js获取鼠标坐标方法全面讲解:clientX/Y,pageX/Y,offsetX/Y,layerX/Y,screenX/Y 一.关于js鼠标事件综合各大浏览器能获取到坐标的属性总共以下五种:eve ...

  5. 关于Echarts的原生js获取DOM元素与动态加载DOM元素的冲突问题

    1.前言: 最近在做的看板项目,因为需要循环加载后台数据,并且用Echarts做数据呈现,所以jQuery和angular等库统统靠边站,Echarts用的是原生js获取DOM元素,至于诸多不兼容等深 ...

  6. 兼容各版本浏览器,封装原生Js获取ClassName

    web前端开发工作中常常会用到获取元素的className,用jQuery的$(".class")方法也可以获取className,但是有时候牵扯到数据而影响的加载顺序的原因会获取 ...

  7. (转)JS获取当前对象大小以及屏幕分辨率等

    原文 JS获取当前对象大小以及屏幕分辨率等   <script type="text/javascript">function getInfo(){       var ...

  8. JS获取当前对象大小以及屏幕分辨率等...

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <meta nam ...

  9. 【Javascript Demo】JS获取当前对象大小以及屏幕分辨率等

    效果如下: 代码如下: <html> <head> <title>获取当前对象大小以及屏幕分辨率等</title> <body> <d ...

随机推荐

  1. Fiddler抓包工具证书安装

    转自:https://www.cnblogs.com/hushaojun/p/6385947.html Fiddler证书安装(查看HTTPS) 现在很多带有比较重要信息的接口都使用了安全性更高的HT ...

  2. idea快捷

    IntelliJ Idea 常用快捷键 列表(实战终极总结!!!!) 1. -----------自动代码-------- 常用的有fori/sout/psvm+Tab即可生成循环.System.ou ...

  3. tomcat第一次使用正常启动后访问8080端口报404错误

    问题:tomcat第一次使用正常启动后访问8080端口报404错误 解决办法:双击tomcat调出tomcat的xml文件页面,Server Locations 默认是选第一行即Use Workspa ...

  4. 几种扫描二维码工具的User-Agent

    微信: user-agent: Mozilla/5.0 (iPhone; CPU iPhone OS 10_3_3 like Mac OS X) AppleWebKit/603.3.8 (KHTML, ...

  5. Spring MVC温故而知新-从零开始

    Spring MVC简介 Spring MVC是一款基于MVC架构模式的轻量级Web框架,目的是将Web开发模块化,对整体架构进行解耦. Spring MVC有一下优点: 作为Spring框架的一部分 ...

  6. ZooKeeper的安装

    一.准备 需要提前安装好Java 准备好zookeeper的软件包:软件包地址   二.部署 解压zookeeper压缩包到指定目录 执行如下命令: .tar.gz -C /opt/   三.修改配置 ...

  7. ES创建mapping时字段别名

    ES默认是动态创建索引和索引类型的mapping的,但是在学习的时候还能这样用,在生产中一定是手动制定mapping!在生产中经常会遇到这样的需求,想用某个字段进行统计,又想对该字段进行模糊查询,解决 ...

  8. sed、awk——运维必须掌握的两个工具

    今天主要跟大家介绍2个非常霸道的工具,sed和awk,本篇文章将介绍这两个工具在日常运维中的常用用法,工作中这两个工具要掌握好了在结合一些管道命令.正则表达式,日常处理事务简直666啦! l Sed ...

  9. IDEA使用教程

    以下内容引自: https://www.cnblogs.com/yjd_hycf_space/p/7483921.html IntelliJ IDEA使用教程(很全) 这个编辑器我就不再多做介绍了.直 ...

  10. java分割字符串用法

    转自 http://www.cnblogs.com/dawnLynn/p/5477263.html 1."."和"|"都是转义字符,必须得加"\\&q ...