一种页面内容切换显示的方法和系统与流程

本发明涉及互联网技术领域，特别涉及一种页面内容切换显示的方法和系统。

背景技术：

随着网络的迅速发展，互联网成为大量信息的载体，文字、图片、数据库、音频、视频多媒体等不同类型数据大量出现于网络，再加以各式各样的网页设计，人类进入了信息爆炸的时代。互联网信息呈现了数据巨大、内容广泛、形式多样、增长迅速的特点。截至2015年12月，仅中国的网页数量达到2123亿个，年增长11.8％；其中，静态网页数量为1314亿，占网页总数量的61.9％，动态网页数量为808亿，占网页总量的38.1％。随着个人博客、自媒体的发展，以及互联网媒体的快速发展，互联网页的数量将会以几何级速的增长。

互联网传播速度快，内容共享自由，所以互联网成为了一个集各种信息资源为一体的资源网，来自各方的人士随时都可以在网上发布信息。这就造成了互联网信息增长迅速、种类繁多、分布广泛的特点，也带来互联网网页设计的多样性。网页设计的特点主要包括：

1、内容和功能第一。网页的核心竞争力是其所包含的内容和功能，好的网页是能够给用户提供更多的功能和内容，能够满足用户的多方面的、多层次的应用需求，能够吸引更多的用户访问，并且拥有较高的回头率。这就需要设计高效、跨领域(如搜索和新闻)、多功能(如搜索和购物)、跨平台(如跨PC和移动设备)的网页，并确保达到好的用户体验。

2、响应式设计。现在越来越多用户都拥有多种终端：台式机，笔记本，平板电脑，手机，能够适应不同尺寸显示屏的网页是现在网页设计的潮流，甚至是未来很长一段时间的设计趋势。响应式设计能保证网页适应不同的分辨率，让网页要素重组，使其无论在垂直的平板电脑还是智能手机上，都能达到最好的视觉效果。除了多终端的多样化，显示屏幕(PC、手机、Pad)都在不断变大，而在对未来生活的概念设计里，“屏幕”这个媒介更是被运用到多种新平台上，例如微软发布的“未来生活概念视频”里，厨房、室内墙壁、办公室玻璃墙面都成为了交互平台。响应式网页设计所具备的良好的适应性和可塑性，在未来的网页设计里将占有举足轻重的位置。

3、追求简洁设计风格。简洁的风格体现在扁平化设计和简单配色两方面。扁平化的极简主义突出了应用的功能，用简化的图表替代了原本精致的描绘，更加突出应用的实际效果，反应使用应用的感受，而不是局限在某个应用的外在形象上。简单配色体现了人们审美需求的改变，同色系网站设计成为主流，而“简化配色”的概念，则是把参与网站设计的颜色局限到1到2个。配色简单的趋势似乎和平面化同步，有些网页甚至摈弃色彩，采用纯黑白(以及两者之间的渐变色)设计，有时在其中加入一点色彩吸引注意力或渲染效果，比如加入醒目的红色。

4、长滚动网页。在PC时代，网络用户并不欢迎长滚动网页，因为长滚动网页会把功能模块淹没在滚动的网页中。移动终端让人们习惯用“滚动条”控制的方式阅读网页、寻找资讯，这样的阅读习惯也影响了网络设计，页面出现更多两侧留白与更多的交互设计。手机浏览器让人们逐渐接受了这种长条形网站布局。此外内容的编排上也更适合阅读理解。此外国内很多购物网站或贴吧都加上了“点击返回页面最上端”的功能，更加方便了浏览长网页。长滚动网页设计，对于用户随时使用网页的应用功能提出了更高的要求。

为了适应现代网页设计和移动互联网发展的需求，在简短的网页中要承载尽可能多的内容，还要保证页面设计的简洁、简单，以提高网页下载和使用的效率。

现有的互联网的网页展示方式，是在一个网页中顺序地展示网页内容，采取传统的长滚动页面，用户浏览时需要不断的下滑网页以获得新的网页内容，在网页内容较多时会下滑较长的距离，给用户使用带来不便；或将内容进行分页展示，点击下一个页面会获得新的网页内容，但是在跳跃阅读或查找网页内容时无法直接到达目标内容，为网页阅读造成不便。

技术实现要素：

本发明提供一种页面内容切换显示的方法和系统，在同一个网页中显示丰富的内容，满足不同使用场景下的内容加载需求，提高了网页内容的吸引力，方便了用户进行网页浏览，有效促进用户使用网页进行交互，增强了网页的显示效果，符合网页设计发展的趋势。

本发明的技术方案提供了一种页面内容切换显示的方法，包括以下步骤：

网页DOM模块承载网页内容；

显示选择的DOM模块；

隐藏除所述选择的DOM模块之外的DOM模块。

进一步的，网页包含至少两个切换显示的所述DOM模块。

进一步的，不同的所述切换显示DOM模块分别承载不同的网页内容。

进一步的，用户选择要显示的所述切换显示DOM模块后，在同一时间只显示一个所述切换显示DOM模块，未被选择的所述切换显示DOM模块处于隐藏状态。

进一步的，默认显示第一个所述切换显示DOM模块。

进一步的，所述切换显示DOM模块在网页中位于相同的位置。

本发明的技术方案还提供了一种页面内容切换显示的系统，其特征在于，包括管理单元和DOM模块，其中：

管理单元用于控制实现DOM模块的切换显示；

DOM模块用于承载网页内容，并切换显示网页内容。

进一步的，在一个网页中，所述DOM模块为至少两个。

进一步的，所述DOM模块之间为切换显示，同一时间只显示一个所述DOM模块。

进一步的，所述DOM模块位于网页中的相同位置。

本发明技术方案在同一个网页中显示丰富的内容，满足不同使用场景下的内容加载需求，提高了网页内容的吸引力，方便了用户进行网页浏览，有效促进用户使用网页进行交互，增强了网页的显示效果，符合网页设计的发展趋势。

本发明的其它特征和优点将在随后的说明书中阐述，并且，部分地从说明书中变得显而易见，或者通过实施本发明而了解。本发明的目的和其他优点可通过在所写的说明书、权利要求书、以及附图中所特别指出的结构来实现和获得。

下面通过附图和实施例，对本发明的技术方案做进一步的详细描述。

附图说明

附图用来提供对本发明的进一步理解，并且构成说明书的一部分，与本发明的实施例一起用于解释本发明，并不构成对本发明的限制。在附图中：

图1为本发明实施例一中页面内容切换显示的方法流程图；

图2为本发明实施例一中页面内容切换显示的系统结构图。

具体实施方式

以下结合附图对本发明的优选实施例进行说明，应当理解，此处所描述的优选实施例仅用于说明和解释本发明，并不用于限定本发明。

图1为本发明实施例一中页面内容切换显示的方法流程图。如图1所示，该页面内容切换显示的方法流程包括以下步骤：

步骤101：网页DOM模块承载网页内容。

网页包含至少两个切换显示的DOM模块。

不同的所述切换显示DOM模块分别承载不同的网页内容。

步骤102：显示选择的DOM模块。

用户选择要显示的DOM模块后，在同一时间只显示一个DOM模块，未被选择的DOM模块处于隐藏状态。

在未选择的情况下，默认显示第一个DOM模块。

DOM模块在网页中位于相同的位置。

步骤103：隐藏除所述选择的DOM模块之外的DOM模块。

为了实现上述实施例一，本实施例还提供了一种页面内容切换显示的系统，图2为本发明实施例一中页面内容切换显示的系统结构图。如图2所示，该系统包括管理单元201和DOM模块202，其中：

管理单元用于控制实现DOM模块的切换显示；

DOM模块用于承载网页内容，并切换显示网页内容。

在一个网页中，至少包含两个DOM模块。

不同的DOM模块之间为切换显示，同一时间只显示一个DOM模块。

DOM模块位于网页中的相同位置，用户使用时会产生切换的视觉效果。

上述实施例中的技术方案在同一个网页中显示丰富的内容，满足不同使用场景下的内容加载需求，提高了网页内容的吸引力，方便了用户进行网页浏览，有效促进用户使用网页进行交互，增强了网页的显示效果，符合网页设计的发展趋势。

本领域内的技术人员应明白，本发明的实施例可提供为方法、系统、或计算机程序产品。因此，本发明可采用完全硬件实施例、完全软件实施例、或结合软件和硬件方面的实施例的形式。而且，本发明可采用在一个或多个其中包含有计算机可用程序代码的计算机可用存储介质(包括但不限于磁盘存储器和光学存储器等)上实施的计算机程序产品的形式。

本发明是参照根据本发明实施例的方法、设备(系统)、和计算机程序产品的流程图和/或方框图来描述的。应理解可由计算机程序指令实现流程图和/或方框图中的每一流程和/或方框、以及流程图和/或方框图中的流程和/或方框的结合。可提供这些计算机程序指令到通用计算机、专用计算机、嵌入式处理机或其他可编程数据处理设备的处理器以产生一个机器，使得通过计算机或其他可编程数据处理设备的处理器执行的指令产生用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的装置。

这些计算机程序指令也可存储在能引导计算机或其他可编程数据处理设备以特定方式工作的计算机可读存储器中，使得存储在该计算机可读存储器中的指令产生包括指令装置的制造品，该指令装置实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能。

这些计算机程序指令也可装载到计算机或其他可编程数据处理设备上，使得在计算机或其他可编程设备上执行一系列操作步骤以产生计算机实现的处理，从而在计算机或其他可编程设备上执行的指令提供用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的步骤。

显然，本领域的技术人员可以对本发明进行各种改动和变型而不脱离本发明的精神和范围。这样，倘若本发明的这些修改和变型属于本发明权利要求及其等同技术的范围之内，则本发明也意图包含这些改动和变型在内。