使用javascript写个方法进行屏目切换检测

在前端开发中，要检测屏幕切换（例如，用户从桌面屏幕切换到移动屏幕，或者从横屏切换到竖屏等），你可以使用window对象的resize事件。这个事件会在窗口大小发生变化时触发，因此可以用来检测屏幕切换。

以下是一个简单的JavaScript方法，用于检测屏幕大小的变化：

function detectScreenChange() {
    let previousWidth = window.innerWidth;
    let previousHeight = window.innerHeight;

    window.addEventListener('resize', function() {
        let currentWidth = window.innerWidth;
        let currentHeight = window.innerHeight;

        if (currentWidth !== previousWidth || currentHeight !== previousHeight) {
            console.log('屏幕大小已变化！');
            console.log('前宽度：', previousWidth, '当前宽度：', currentWidth);
            console.log('前高度：', previousHeight, '当前高度：', currentHeight);

            // 更新之前的宽度和高度值，以便下次比较
            previousWidth = currentWidth;
            previousHeight = currentHeight;
        }
    });
}

detectScreenChange();

这段代码首先记录了初始的屏幕宽度和高度，然后在窗口大小发生变化时，通过比较当前的宽度和高度与之前的值来检测屏幕是否发生了变化。如果发生了变化，就会在控制台中打印出相应的信息，并更新之前的宽度和高度值。

请注意，resize事件可能会在短时间内频繁触发，因此在实际应用中，你可能需要使用防抖（debounce）或节流（throttle）技术来优化性能。

此外，这个方法只能检测到屏幕大小的变化，而不能直接检测到设备的切换（例如，从桌面切换到移动设备）。如果你需要检测设备的切换，可能需要结合用户代理字符串（User-Agent string）或其他设备检测方法来实现。

如果你想要检测横屏和竖屏的切换，你可以通过比较window.innerWidth和window.innerHeight的值来判断当前是横屏还是竖屏。例如：

function detectOrientationChange() {
    let isPortrait = window.innerHeight > window.innerWidth;

    window.addEventListener('resize', function() {
        let currentIsPortrait = window.innerHeight > window.innerWidth;

        if (currentIsPortrait !== isPortrait) {
            console.log('屏幕方向已变化！');
            isPortrait = currentIsPortrait;
        }
    });
}

detectOrientationChange();

这段代码通过比较窗口的宽度和高度来判断当前是横屏还是竖屏，并在屏幕方向发生变化时在控制台中打印出相应的信息。