screenWidth、clientWidth、offsetWidth、 scrollWidth的区别
在做移动端开发的时候，我们会需要用到屏幕的宽度，根据不同屏幕的宽度写交互代码。
有那么多种宽度，我们应该用哪个呢？它们有什么区别呢？
document.body.clientWidth：可见区域宽。
document.body.offsetWidth：对象整体的实际宽度，包滚动条等边线，会随对象显示大小的变化而改变。
window.screen.width：屏幕分辨率宽（设备屏幕大小）。
document.body.scrollWidth：一般就是浏览器窗口的宽度；
例如：元素的内容超过可视区，滚动条出现和可用的情况下：
在做移动端开发时，我们需要知道设备的真实大小，所以需要用到设备屏幕分辨率window.screen.width
在开发过程中，可以使用它来进行js逻辑判断。
例如：在vue中，将PC端页面适应到移动端，可以使用window.screen.width的大小判断是否是移动端，从而控制元素是否显示。
<p v-if="!isMobileSize"> //当设备是移动端时，isMobileSize为true,当设备不是移动端时，才显示这个元素
{
{ data.name || - }}
</p>
<script>
export default {
computed:{
//这个函数就是getter
isMobileSize :function(){
var screenWidth = window.screen.width;
return screenWidth <= 1024; //假设设备宽度小于等于1024时，是移动端，true
}
}
}
</script>
