javascript - 仅在需要时才在 DOM 中使用 jQuery 加载 HTML 元素

Question

我想在桌面上加载侧边栏并在移动设备上隐藏它，但不仅仅是隐藏它:将其完全删除，以便不加载它。

在此之前，我尝试在 jQuery 中使用媒体查询和remove，但是在这两个中，它们都是在隐藏之前加载的......所以我的解决方案现在是仅在需要时加载 html，但问题是我不知道该怎么做。

这是否类似于$("#containerDiv").append();？

我实际上不明白，因为这不是与使用 jQuery 删除它相同还是我看错了？这不是服务器端，对吧？

Answer 1

这对你不起作用，因为你不使用
<meta name="viewport" content="width=device-width, height=device-height" /> (我在上一个问题中说你用我的 Android 手机检查了这一点)
在所有解决方案中，您的页面必须在 javascript 更改页面之后加载
你有3种方式
1:使用媒体查询
2:使用以前的方式加载页面检查页面大小并删除对象
3:使用服务器端
在 PHP 中

function check_user_agent ( $type = NULL ) {
        $user_agent = strtolower ( $_SERVER['HTTP_USER_AGENT'] );
        if ( $type == 'bot' ) {
                // matches popular bots
                if ( preg_match ( "/googlebot|adsbot|yahooseeker|yahoobot|msnbot|watchmouse|pingdom\.com|feedfetcher-google/", $user_agent ) ) {
                        return true;
                        // watchmouse|pingdom\.com are "uptime services"
                }
        } else if ( $type == 'browser' ) {
                // matches core browser types
                if ( preg_match ( "/mozilla\/|opera\//", $user_agent ) ) {
                        return true;
                }
        } else if ( $type == 'mobile' ) {
                // matches popular mobile devices that have small screens and/or touch inputs
                // mobile devices have regional trends; some of these will have varying popularity in Europe, Asia, and America
                // detailed demographics are unknown, and South America, the Pacific Islands, and Africa trends might not be represented, here
                if ( preg_match ( "/phone|iphone|itouch|ipod|symbian|android|htc_|htc-|palmos|blackberry|opera mini|iemobile|windows ce|nokia|fennec|hiptop|kindle|mot |mot-|webos\/|samsung|sonyericsson|^sie-|nintendo/", $user_agent ) ) {
                        // these are the most common
                        return true;
                } else if ( preg_match ( "/mobile|pda;|avantgo|eudoraweb|minimo|netfront|brew|teleca|lg;|lge |wap;| wap /", $user_agent ) ) {
                        // these are less common, and might not be worth checking
                        return true;
                }
        }
        return false;
}

此函数检查您的代理调用，如下面的代码

if(check_user_agent('mobile'))
{
   echo 'mobile content';
}
else if(check_user_agent('browser'))
{
   echo 'desktop content';
}