CN103942036A - 一种网页内容编辑方法和装置 - Google Patents

Abstract

本发明实施例公开了一种网页内容编辑方法，包括：监控到待编辑网页上向指定区域导入页面片的导入指令时，显示预置的页面片集合中的页面片，所述页面片集合中包括至少一个页面片；接收到对所述页面片集合中的页面片的选择操作时，将选中的页面片导入到所述待编辑网页的指定区域。采用本发明，通过对经常使用的页面片进行保存，在后续的开发过程中直接调用已保存的页面片，可提高网页开发的效率。

Description

一种网页内容编辑方法和装置

技术领域

本发明涉及计算机领域，尤其涉及一种网页内容编辑方法和装置。

背景技术

在现有技术中，网页的开发通常通过运行在计算机设备上的软件来完成，如内容管理系统，内容管理系统是一种位于Web后端（Web服务器）和前端办公系统或流程（内容创作、编辑）之间的软件。内容管理解决方案重点解决各种非结构化或半结构化的数字资源的采集、管理、利用、传递和增值，并能有机集成到结构化数据的商业智能环境中。内容的创作人员、编辑人员、发布人员使用内容管理系统来提交、修改、审批、发布内容。这里指的"内容"可能包括文件、表格、图片、数据库中的数据甚至视频等一切你想要发布到Internet、Intranet以及Extranet网站的信息。

随着网络应用的丰富和发展，很多网站往往不能迅速跟进大量信息衍生及业务模式变革的脚步，常常需要花费许多时间、人力和物力来处理信息更新和维护工作。在开发过程中，我们经常会遇到相似的代码内容，其对应的网页内容是一致的，而开发人员需要重新编写网页代码，或复制粘贴以前的代码，开发效率低下。

发明内容

本发明实施例所要解决的技术问题在于，提供一种网页内容编辑方法和装置。可解决现有技术中，在维护和更新网页时，对于多次出现的页面片需要重新编写代码，或复制粘贴以前的代码，开发效率低下的不足。

为了解决上述技术问题，本发明实施例提供了一种网页内容编辑方法，包括：

监控到待编辑网页上向指定区域导入页面片的导入指令时，显示预置的页面片集合中的页面片，所述页面片集合中包括至少一个页面片；及

接收到对所述页面片集合中页面片的选择操作时，将选中的页面片导入到所述待编辑网页的指定区域中，以完成编辑该待编辑网页。

相应地，本发明实施例还提供了一种网页内容编辑装置，包括：

第一显示模块，用于监控到待编辑网页上向指定区域导入页面片的导入指令时，显示预置的页面片集合中的页面片，所述页面片集合中包括至少一个页面片；

导入模块，用于接收到对所述页面片集合中页面片的选择操作时，将选中的页面片导入到所述待编辑网页的指定区域中，以完成编辑该待编辑网页。

实施本发明实施例，具有如下有益效果：

通过统计网页开发过程中经常使用的代码，将其作为页面片保存到页面片集合中，在后续的开发过程中，遇到相同的页面片可以直接导入保存在页面片集合中的页面片，不需重新编写代码，提高了开发的效率。

附图说明

为了更清楚地说明本发明实施例或现有技术中的技术方案，下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本发明的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。

图1是本发明第一较佳实施例中网页内容编辑装置的结构示意图；

图2是本发明第二较佳实施例中网页内容编辑装置的结构示意图；

图3是本发明第一较佳实施例中网页内容编辑方法的作业流程示意图；

图4是本发明第二较佳实施例中网页内容编辑方法的作业流程示意图。

具体实施方式

下面将结合本发明实施例中的附图，对本发明实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅仅是本发明一部分实施例，而不是全部的实施例。基于本发明中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例，都属于本发明保护的范围。

参见图1，为本发明第一较佳实施例中网页内容编辑装置（以下简称为“编辑装置1”）的结构示意图，包括：

第一显示模块11，用于监控到待编辑网页上向指定区域导入页面片的导入指令时，显示预置的页面片集合中的页面片，所述页面片集合中包括至少一个页面片。

具体的，将一个空白的网页或者已编写部分代码的网页作为待编辑网页，当第一显示模块11监控到待编辑网页上向指定区域导入页面片的导入指令时，显示预置的页面片集合中所有的页面片。

本实施例中，所述编辑装置1可以是个人电脑或者工作站等设备，用户通过该编辑装置1执行待编辑网页的编辑功能，也可以是其他设备，本发明不作限制。

页面片包括网页中指定区域的代码，例如，腾讯网首页中的导航栏和财经、股票板块等区域的HTML（Hypertext Markup Language，超文本标记语言，简称HTTP）代码和内嵌的CSS（Cascading Style Sheet，级联样式表，简称CSS）代码。开发人员在后续的维护开发过程中，根据需要将重复利用的页面片保存到指定位置的页面片集合中。所述页面片集合可以是一个数据库，各个页面片单独的存放在该数据库中，同时显示各个页面片汇总起来的一个表格，其中，每个页面片嵌入有CSS代码，用于指示该页面片的显示效果，如字体、颜色和动态效果等，通过CSS代码可以预览页面片集合中页面片的显示效果。

导入模块12，用于在接收到对所述页面片集合中的页面片的选择操作时，将选中的页面片导入到所述待编辑网页的指定区域。

具体的，用户从页面片集合中选取一张页面片，通过点击选中的页面片，导入模块12将该页面片导入到待编辑网页的指定区域中，以实现对该待编辑网页进行编辑。

实施本发明的实施例，通过统计网页开发过程中经常使用的代码，将其作为页面片保存到页面片集合中，在后续的开发过程中，遇到相同的页面片可以直接导入保存在页面片集合中的页面片，不需重新编写代码，提高了开发的效率。

进一步的，参见图2，为本发明第二较佳实施例中编辑装置1的结构示意图，除包括第一显示模块11和导入模块12之外，还包括：

判断模块13，用于判断是否检测到对所述待编辑网页上的导入按钮的点击操作，若判断为是，则确定监控到所述导入指令。

具体的，待编辑网页的指定区域预先设置有一个导入按钮，判断模块13检测到导入按钮上是否发生点击操作。判断是否发生点击操作的方法具体为，检测是否在导入按钮上发生鼠标事件，当判断为是时，确定监控到导入指令，指示第一显示模块11显示页面片集合，若没有检测到点击操作，则继续判断。

第二显示模块14，用于显示编辑完成后的网页的预览视图和所述待编辑网页对应的HTML代码和CSS代码。

具体的，页面片中的HTML代码和对应的CSS代码插入完成后，第二显示模块14通过接收到用户预览指令，显示插入该页面片后的待编辑网页的显示效果和对应的代码。

发布模块15，用于保存并发布编辑完成后的网页。

具体的，用户按照上述的方法将完成所述待编辑网页的编辑操作时，发布模块15通过网页发布工具发布编辑完成后网页，该网页发布工具可以是Frontpage或Dreamweaver等，本实施例不作限制。

页面片生成模块16，用于当接收到所述编辑完成后的网页上的指定区域的选择操作时，将所述指定区域的内容生成新页面片并保存至所述页面片集合中。

具体的，页面片生成模块16接收到编辑完成后的网页上指定区域的选择操作时，将所述指定区域的内容生成的新页面片保存至所述页面片集合中，通过新页面片的生成扩展了页面片集合，使得后续开发过程中可以调用的页面片的数量增多，提高了开发的效率。

页面片编辑模块17，用于当接收到对所述页面片集合中指定页面片的编辑指令时，显示所述指定页面片对应的代码。

具体的，页面片集合中的各个页面片是可以修改的，当接收到用户的编辑指令时，显示用户选中的页面片的代码，用户通过修改代码可以实现对该页面片的编辑，这样页面片能根据需要进行自定义，配置更加灵活。

进一步的，当用户点击某个页面片进行预览操作时，第一显示模块11还用于显示该页面片的预览视图，用户可以查看该页面片的显示效果，当显示效果达不到用户要求时，用户还可以对该页面片对应的代码进行重复修改。

在第二较佳实施例中，导入模块12具体用于将选中的页面片的HTML代码和对应的CSS代码插入到所述待编辑网页的代码的指定位置。

具体的，页面片的代码中包括一个第一标识，待编辑网页的代码中包括第二标识，导入模块12在接收到对页面片集合中页面片的选择操作时，查询待编辑网页的代码中预置的第二标识。本实施例中，所述第一标识和第二标识可以用数字或字母的形式表示。当判断所述第一标识和所述第二标识相同时，导入模块12将页面片的代码插入到所述第二标识的后面，根据页面片中的位置信息和尺寸信息将所述页面片显示在待编辑网页的指定位置上。

实施本发明的实施例，通过统计网页开发过程中经常使用的代码，将其作为页面片保存到页面片集合中，在后续的开发过程中，遇到相同的页面片可以直接导入保存在页面片集合中的页面片，不需重新编写代码，提高了开发的效率。

参见图3，为本发明第一较佳实施例中网页内容编辑方法的作业流程示意图，包括：

步骤101、监控到待编辑网页上向指定区域导入页面片的导入指令时，显示预置的页面片集合中的页面片，所述页面片集合包括至少一个页面片。

具体的，将一个空白的网页或者已编写部分代码的网页作为待编辑网页，当网页内容编辑装置的第一显示模块11监控到待编辑网页上向指定区域导入页面片的导入指令时，显示预置的页面片集合中所有的页面片。本实施例中编辑装置1可以是个人电脑或者工作站等设备，用户通过该编辑装置1执行待编辑网页的编辑功能，也可以是其他设备，本发明不作限制。

页面片集合可以是数据库的形式，也可以使其他形式，本发明不作限制。每个页面片嵌入有CSS代码，用于指示该页面片的显示效果，如字体、颜色和动态效果等，通过CSS代码可以预览页面片集合中页面片的显示效果。

步骤102、当在接收到对所述页面集合中页面片的选择操作时，将选中的页面片导入到所述待编辑网页的指定区域中。

具体的，用户从页面片集合中选取一个页面片，通过点击选中的页面片，导入模块12将该页面片导入到待编辑网页的指定区域中，以实现对该待编辑网页进行编辑。

实施本发明的实施例，通过统计网页开发过程中经常使用的代码，将其作为页面片保存到页面片集合中，在后续的开发过程中，遇到相同的页面片可以直接导入保存在页面片集合中的页面片，不需重新编写代码，提高了开发的效率。

参见图4，为本发明第二较佳实施例中网页内容编辑方法的作业流程示意图，包括：

步骤201、判断是否检测到对所述待编辑网页上导入按钮的点击操作。

具体的，在待编辑网页的指定区域预先设置一个导入按钮，网页内容编辑装置的第一显示模块11检测到导入按钮上是否发生点击操作。当判断为是时，确定监控到导入指令，开始执行步骤202，若没有检测到点击操作，则继续判断。

步骤202、显示预置的页面片集合中的页面片，所述页面片集合中包括至少一个页面片。

具体的，第一显示模块11监控到待编辑网页上向指定区域导入页面片的导入指令时，显示预置的页面片集合中所有的页面片，页面片集合可以是数据库的形式，显示各个页面片汇总起来的一个表格，每个页面片内嵌有CSS代码，该CSS代码用于指示对应的页面片的显示效果，如字体、颜色和动态效果等，通过该CSS代码可以预览页面片的显示效果。

步骤203、接收到对所述预置的页面片集合中的指定页面片的预览指令时，显示所述指定页面片的预览视图。

具体的，页面片集合中页面片的表现形式可以为包括页面片的数据库，在网页编辑时通常需要预览其显示效果，由于页面片集合中的每个页面片都内嵌有指定的CSS代码，该CSS代码用于指示该页面片的显示效果，如字体、颜色和动态效果等。第一显示模块11在接收到指定页面片的预览指令时，根据该指定页面片的CSS代码显示所述指定页面片的效果。同时，当用户对显示效果不满意时，发送一个编辑指令给页面片编辑模块17，页面片编辑模块17显示该指定页面片的代码，用户可以对所述指定页面片对应的代码进行修改，自定义所述指定页面的显示效果。

步骤204，接收到对所述页面片集合中页面片的选择操作时，将选中的页面片的HTML代码和对应的CSS代码作为一个整体插入到待编辑网页的代码中的指定位置上。

具体的，页面片的HTML代码和对应的CSS代码是一个整体，CSS代码嵌入到页面片的HTML代码中，CSS代码用来描述该HTML代码显示的效果，页面片中包括网页上指定区域的代码。页面片的代码中包括一个第一标识，待编辑网页的代码中包括第二标识，导入模块12在接收到对页面片集合中页面片的选择操作时，查询待编辑网页的代码中预置的第二标识。本实施里中，所述第一标识和第二标识可以用数字或字母的形式表示。当判断所述第一标识和所述第二标识相同时，导入模块12将页面片的代码插入到所述第二标识的后面，根据页面片中的位置信息和尺寸信息将所述页面片显示在待编辑网页的指定位置上。

步骤205、显示编辑完成后的网页的预览视图和所述待编辑网页对应的HTML代码和CSS代码。

具体的，页面片中的HTML代码和对应的CSS代码插入完成后，第二显示模块14通过接收到用户预览指令，预览插入该页面片后的待编辑网页的显示效果和对应的代码。

步骤206、保存并发布编辑完成后的网页。

具体的，用户按照上述的方法将完成所述待编辑网页的编辑操作时，发布模块15通过网页发布工具发布编辑完成后的网页，该网页发布工具可以是Frontpage或Dreamweaver等，本实施例不作限制。同时，页面片生成模块16接收到编辑完成后的网页上指定区域的选择操作时，将所述指定区域的内容生成的新的页面片并保存至所述页面片集合中，通过新页面片的生成扩展了页面片集合，使得后续开发过程中可以调用的页面片的数量增多，提高了开发的效率。

实施本发明的实施例，通过统计网页开发过程中经常使用的代码，并将其生成页面片保存到页面片集合中，在后续的开发过程中，遇到相同的页面片可以直接从页面片集合中导入该保存的页面片，不需重新编写代码，提高了开发的效率。

本领域普通技术人员可以理解实现上述实施例方法中的全部或部分流程，是可以通过计算机程序来指令相关的硬件来完成，所述的程序可存储于一计算机可读取存储介质中，该程序在执行时，可包括如上述各方法的实施例的流程。其中，所述的存储介质可为磁碟、光盘、只读存储记忆体（Read-Only Memory，ROM）或随机存储记忆体（Random Access Memory，RAM）等。

以上所揭露的仅为本发明一种较佳实施例而已，当然不能以此来限定本发明之权利范围，本领域普通技术人员可以理解实现上述实施例的全部或部分流程，并依本发明权利要求所作的等同变化，仍属于发明所涵盖的范围。

Claims (14)

1.一种网页内容编辑方法，其特征在于，包括：

监控到待编辑网页上向指定区域导入页面片的导入指令时，显示预置的页面片集合中的页面片，所述页面片集合中包括至少一个页面片；及

接收到对所述页面片集合中页面片的选择操作时，将选中的页面片导入到所述待编辑网页的指定区域中，以完成编辑该待编辑网页。

2.如权利要求1所述的方法，其特征在于，在所述监控到待编辑网页上向指定区域导入页面片的导入指令步骤之前，该方法还包括：

判断是否检测到对所述待编辑网页上的导入按钮的点击操作，若判断为是，则确定监控到所述导入指令。

3.如权利要求2所述的方法，其特征在于，所述页面片包括HTML代码和CSS代码；

所述显示预置的页面片集合中的页面片包括：

在接收到对所述预置的页面片中的指定页面片的预览指令时，显示所述指定页面片的预览视图。

4.如权利要求3所述的方法，其特征在于，所述将选中的页面片导入到所述待编辑网页的指定区域包括：

将选中的页面片的HTML代码和对应的CSS代码插入到所述待编辑网页的代码的指定位置。

5.如权利要求3所述的方法，其特征在于，所述接收到对所述页面片集合中的页面片的选择操作时，将选中的页面片导入到所述待编辑网页的指定区域之后，该方法还包括：

显示编辑完成后的网页的预览视图和所述待编辑网页对应的HTML代码和CSS代码；

保存并发布编辑完成后的网页。

6.如权利要求5所述的方法，其特征在于，还包括：

当接收到所述编辑完成后的网页上的指定区域的选择操作时，将所述指定区域的内容生成新页面片并保存至所述页面片集合中。

7.如权利要求1-6任一项所述的方法，其特征在于，还包括：

当接收到对所述页面片集合中指定页面片的编辑指令时，显示所述指定页面片对应的代码。

8.一种网页内容编辑装置，其特征在于，包括：

第一显示模块，用于监控到待编辑网页上向指定区域导入页面片的导入指令时，显示预置的页面片集合中的页面片，所述页面片集合中包括至少一个页面片；及

导入模块，用于接收到对所述页面片集合中页面片的选择操作时，将选中的页面片导入到所述待编辑网页的指定区域中，以完成编辑该待编辑网页。

9.如权利要求8所述的装置，其特征在于，还包括：

判断模块，用于判断是否检测到对所述待编辑网页上的导入按钮的点击操作，若判断为是，则确定监控到所述导入指令。

10.如权利要求9所述的装置，其特征在于，所述第一显示模块还用于在接收到对所述预置的页面片中的指定页面片的预览指令时，显示所述指定页面片的预览视图，其中，所述页面片包括HTML代码和CSS代码。

11.如权利要求10所述的装置，其特征在于，所述导入模块具体用于将选中的页面片的HTML代码和对应的CSS代码插入到所述待编辑网页的代码的指定位置。

12.如权利要求11所述的装置，其特征在于，还包括：

第二显示模块，用于显示编辑完成后的网页的预览视图和所述待编辑网页对应的HTML代码和CSS代码；

发布模块，用于保存并发布编辑完成后的网页。

13.如权利要求12所述的装置，其特征在于，还包括：

页面片生成模块，用于当接收到所述编辑完成后的网页上的指定区域的选择操作时，将所述指定区域的内容生成新页面片并保存至所述页面片集合中。

14.如权利要求8-13任一项所述的装置，其特征在于，还包括:

页面片编辑模块，用于当接收到对所述页面片集合中指定页面片的编辑指令时，显示所述指定页面片对应的代码。