是否有可能使用Javascript或任何服务器端技术从移动端源代码中删除HTML的某些部分?

Is it possible to remove some part of HTML from source for mobile using Javascript or any server side technique?

本文关键字：HTML 删除 源代码 些部 移动 Javascript 有可能 任何 技术 服务器端 是否      更新时间：2023-09-26

是否有可能删除(不隐藏使用display:none ) HTML的某些部分从源移动使用Javascript或任何服务器端技术?

以为例，假设下面是网站

其中一个页面的<body>内的代码

例如，这是桌面浏览器的页面。

<header class="hd1">
        <hgroup>
        <h1>A Responsive page</h1>
        </header>
    <div class="main">
        <section class="hs1">
            <header>
            <h1>This is a Page Sub Title</h1>
            </header>
            <p>Some content...</p>
            <h2>Demonstrating EM and STRONG</h2>
            <p>This text will have more importance></p>

        </section><!-- .hs1 -->
        </div><!-- .main -->
    <aside class="sidebar">
    <p>Sidebar content</p>
    </aside>
    <footer class="f1">
    <p>copyright &copy; year</p>
    </footer>

和使用相同的页面移动设备我只想从源中删除<aside>...</aside>。

我不能使用不同的页面，因为是基于CMS的。通过更新我想在所有设备上显示的内容。但在移动版的网站，我只是想删除(隐藏)一些东西从源。因为如果我只使用display:none移动将加载相同数量的桌面版本的数据，这不是在移动设备上的性能。我们是否可以使用Javascript或服务器端技术删除移动端源代码的某些特定部分?

回复后编辑

正如许多用户评论的那样，JavaScript不能用于减少移动用户的有效负载。那么，服务器端的解决方案是什么呢?它可以交付相同的页面，但在交付之前从源代码中删除部分内容?

您可以在服务器上检测移动浏览器，而不呈现此标记。

如果你这样做是为了节省带宽，那么用javascript删除这个是没有意义的。

当然这可以在服务器端完成。您可以通过两种方式解决这个问题(script在下面表示服务器端的脚本，而不是浏览器中的脚本):

  • 脚本构建HTML，并且只根据目标平台输出。
  • 脚本根据目标平台输出HTML和过滤器/后处理更改。

在HTML/XHTML领域中的一种技术是XSL转换。你可以用PHP来运行它们，在PHP扩展中提供了对XSL的支持。

当然，您也可以手动执行字符串操作或DOMDocument和DOMXpath。

要对标准输出进行后处理，可以通过实现输出处理程序/回调来实现。

我不确定这是否适合您，但有一个替代解决方案。这不是直截了当的，但很有趣:)。

  1. 默认只返回页面的"轻量级"版本。
  2. 检测使用JavaScript，如果我们是在低带宽连接。
    3. 如果我们不是慢速连接，那么使用AJAX加载其余部分。

Modernizr引入了一个检测慢速连接的特性测试(参见this):

var connection = navigator.connection || { type: 0 }; // polyfill
return connection.type == 3 // connection.CELL_2G 
  || connection.type == 4   // connection.CELL_3G
  || /^[23]g$/.test(connection.type); // string value in new spec

问题是——当前的浏览器似乎不支持这一点。

在使用这个连接测试(也许UA嗅探作为备份)之后，您可以使用$.load()加载页面的其余部分。

使用asp.net，您可以设置div或任何HTML元素在服务器端运行，然后根据设备以编程方式隐藏或显示。您可以使用一些设备和功能缺陷框架来决定。

我相信用PHP也不会太难

相关文章：