[发明专利]一种Web页面的编辑方法和装置

说明书

本发明提供一种Web页面的编辑方法、装置、电子设备和计算机可读介质，能够精确控制Web页面区域HTML代码的正确性，保证最终用户提交的Web页面部分区域HTML代码格式正确，从而保证整个Web页面格式正确，不会出现页面错乱的情况。本发明的Web页面的编辑方法包括：当收到用户选定一个所述区域进行编辑的指示时，从服务端获取该选定区域的HTML片段；从所述HTML片段中提取该选定区域各编辑对象的HTML DOM元素属性；为每个编辑对象生成与各自的HTML DOM元素属性对应的输入控件，所述输入控件用于接收对编辑对象的编辑内容；将各输入控件中接收到的编辑内容与所述HTML片段按照预设格式拼接，得到编辑后的HTML片段。

技术领域

本发明涉及计算机技术领域，尤其涉及一种Web页面的编辑方法、装置、电子设备和计算机可读介质。

背景技术

在各类网站的首页或频道页上往往有一些区域是需要人工设置的，例如常见的首页推广焦点图，边栏上的推荐内容等。这些区域的HTML格式需要符合给定的格式才能正确的显示页面，如果HTML格式错误，会导致页面内容错乱，影响用户体验。

目前通常采用的方案是通过HTML的超文本编辑器来编辑上述页面区域，例如tinymce、FCKEditor，FreeTextBox等编辑器，该方案主要是通过将编辑内容设置到一个新的iframe(一个HTML标签)中，然后将此iframe的document的contenteditable属性设置为true，并通过浏览器的命令来编辑该iframe的内容，其中，当编辑发生时该iframe的内容被写入到文本域中。

在实现本发明过程中，发明人发现现有技术中至少存在如下问题：上述的将iframe的contenteditable属性设置为true，然后通过浏览器进行编辑的方案，不可控制HTML区域内容的格式，可能会导致页面格式错乱。

发明内容

有鉴于此，本发明提供一种Web页面的编辑方法、装置、电子设备和计算机可读介质，能够精确控制Web页面区域HTML代码的正确性，保证最终用户提交的Web页面部分区域HTML代码格式正确，从而保证整个Web页面格式正确，不会出现页面错乱的情况。

为实现上述目的，根据本发明实施例的一个方面，提供了一种Web页面的编辑方法。

一种Web页面的编辑方法，所述Web页面包括多个区域，每个区域包括一个或多个编辑对象，所述方法包括：当收到用户选定一个所述区域进行编辑的指示时，从服务端获取该选定区域的HTML片段；从所述HTML片段中提取该选定区域各编辑对象的HTML DOM元素属性；为每个编辑对象生成与各自的HTML DOM元素属性对应的输入控件，所述输入控件用于接收对编辑对象的编辑内容；将各输入控件中接收到的编辑内容与所述HTML片段按照预设格式拼接，得到编辑后的HTML片段，其中DOM为文档对象模型(Document Object Model)。

可选地，收到用户选定一个所述区域进行编辑的指示之前，还包括：预先为所述区域添加可隐藏的悬浮层，所述悬浮层包括用于接收用户发出的编辑该区域的指示的接口，并且，所述悬浮层在该区域被选定时显示，在该区域未被选定时隐藏，其中，当鼠标移动到该区域上时该区域被选定。

可选地，每个编辑对象具有各自的路径信息，所述路径信息为DOM路径信息，从所述HTML片段中提取该选定区域各编辑对象的HTMLDOM元素属性，包括：根据所述各编辑对象的DOM路径信息得到所述HTML片段中所述DOM路径信息指示的DOM元素；从所述各DOM元素中提取HTML DOM元素属性。