JavaScript检测iPad和Android设备横竖屏切换脚本示例

这段JavaScript代码主要用于检测移动设备（如iPad和Android设备）的屏幕方向（横屏或竖屏），并根据检测结果弹出相应的提示信息。以下是详细解析： 1. 检测设备类型： 首先，代码通过`navigator.userAgent`获取用户的浏览器信息。`indexOf()`方法被用来检查字符串中特定子串是否存在。如果用户代理字符串（UA）中包含"iPad"，则设备类型被设置为"isIpad"；如果包含"Android"，则设为"isAndroid"。如果既无iPad也无Android，代码会弹出警告，表明设备不支持检测。 2. 判断屏幕方向： - 对于iPad：`Math.abs(window.orientation)`用于获取当前屏幕的方向角度，取绝对值是为了消除方向不确定的情况。如果角度为90度（即横屏），则显示"ipad横屏"，否则显示"ipad竖屏"。 - 对于Android：同样获取屏幕角度，但这里有一个条件判断，即当角度不等于90度时，说明是横屏，所以显示"横屏"，反之则显示"竖屏"。 3. 事件监听： 使用`window.addEventListener()`方法，监听`orientationEvent`（可能是"orientationchange"或"resize"）。这个事件会在设备的屏幕方向改变时触发，从而执行判断屏幕方向的逻辑。 4. 兼容性处理： 代码采用了现代浏览器支持的`orientationchange`事件，如果该事件在`window`对象上不可用，则退而求其次使用`resize`事件。这是因为`orientationchange`事件在许多旧版浏览器（尤其是Android早期版本）中可能不被支持。 这段JavaScript代码提供了一种简单的方法来判断移动设备（特别是iPad和Android设备）的屏幕方向，并根据结果调整应用的布局或者提供用户体验提示。它展示了在开发针对移动设备的Web应用时，如何利用现代浏览器的特性来检测设备状态，以优化页面呈现和交互。