Javascript 根据设备（手机/平板电脑等）控制元素的加载方式

我需要使用Javascript/jQuery来控制我的元素加载方式，这意味着如果我在iPhone或Android手机上，或者在iPad和平板电脑上。我不想使用CSS媒体查询，我需要在Javascript或jQuery中使用它。任何要阅读的提示或链接都很好，谢谢

您可以从中检测设备宽度并更改设置/元素吗

var viewSize = $(window).width();

/* if is below 481px  then it might be a phone :) */
if (viewSize < 481) {
  //something special
}
...

var viewSize=$（窗口）.width（）；
/*如果低于481px，则可能是手机：）*/
如果（视图大小<481）{
//特别的东西
}
...

我使用screen.width，效果很好。只需确保脚本位于页面末尾之前，以确保所有元素都已加载。代码如下：

<script type="text/javascript">
$(document).ready(function() {
if ((screen.width>720)) {
document.getElementById("photos").style.marginLeft="110px";
document.getElementById("videos").style.marginRight="100px";
}
});
</script>

$（文档）.ready（函数（）{
如果（（屏幕宽度>720））{
document.getElementById（“photos”）.style.marginLeft=“110px”；
document.getElementById（“视频”）.style.marginRight=“100px”；
}
});

为什么不使用媒体查询？