移动端如何获取屏真正的宽度，更方便采用viewport进行对页面进行缩放

Question

平时在切面的时候，我的是按照640宽度切页面，然后将屏幕宽度与640进行比较，获取缩放比例，在iPhone中是好好的，但是在有些安卓机不就不行了，比如酷派，我获取到他的宽度是760像素，我在写js的时候，已经做了判断，大于640的时候，就按照640的呈现，但是在酷派中，虽然按照640呈现的，但是页面完全适配酷派的手机。超出屏幕宽度了。是不是手机的实际的像素跟屏幕的宽度不同啊，js中我是这样获取屏幕宽度的window.screen.width

Answer 1

可以参考下这个 移动屏幕适配

Answer 2

利用screen.width并结合viewport标签：

To reliably use JavaScript to retrieve the actual width of the screen a visitor is using , nowadays you have to use the screen.width property in combination with a viewport meta-tag with width=device-width.

文章： Javascript - get device width / screen width on mobile devices

SO上的相关问题：Get the device width in javascript

You can get the device screen width via the screen.width property.
Sometimes it's also useful to use window.innerWidth (not typically found on mobile devices) instead of screen width when dealing with desktop browsers where the window size is often less than the device screen size.

Typically, when dealing with mobile devices AND desktop browsers I use the following:

var width = (window.innerWidth > 0) ? window.innerWidth : screen.width;