个页面元素，以及各个页面元素在 操作页面中的位置信息，生成页面文档。
[0238] A2、如A1所述的方法，在所述页面操作框架中，接收用户插入的页面元素之后，还 包括
[0239] 接收对所述页面元素的编辑操作，并确定编辑操作后的页面元素在操作页面中的 位置信息。
[0240] A3、如A2所述的方法，所述接收对所述页面元素的编辑操作，并确定编辑操作后 的页面元素在操作页面中的位置信息包括：
[0241] 接收用户对所述操作页面中的页面元素的拖拽操作，并根据所述拖拽操作重新确 定所述页面元素在所述页面操作框架中的位置信息。
[0242] A4、如A1或A2所述的方法，
[0243] 如果所述页面操作框架包括多个操作页面，则在各个操作页面中，接收用户插入 的页面元素之后，还包括：
[0244] 接收对操作页面的翻页操作，在进入所述翻页操作指示的操作页面之后，在所述 操作页面中接收用户插入的页面元素。
[0245]A5、如A1或A2所述的方法，所述在各个操作页面中，接收用户插入的页面元素之 后，还包括：
[0246] 接收对操作页面的翻页操作，当所述翻页操作指示的操作页面不存在，则在所述 页面操作框架中添加一个新的操作页面，在所述新的操作页面中接收用户插入的页面元 素。
[0247] A6、如A1所述的方法，根据页面操作框架，操作页面，操作页面中的各个页面元 素，操作页面在页面操作框架中的位置信息，以及各个页面元素在操作页面中的位置信息， 生成页面文档，包括：
[0248] 针对页面操作框架对生成body标签，针对每个操作页面生成一个父div标签，针 对操作页面中的每个页面元素生成该操作页面的父div标签的子div标签；
[0249] 在每个子div标签中，针对相应的页面元素内容，生成相应的元素标签以及元素 内容代码；
[0250] 根据各个页面元素在操作页面中的位置信息，各操作页面在页面操作框架中的位 置信息，确定每个父div标签和每个子div标签的CSS位置信息；
[0251] 根据所述body标签、所述父div标签、所述子div标签、每个父div标签和每个子 div标签的CSS位置信息，生成页面文档。
[0252]A7、如A1所述的方法，在生成页面文档之后，还包括：
[0253] 接收对所述页面文档的导出操作；
[0254] 或者，针对所述页面文档生成对应的访问网址。
[0255] A8、如A1所述的方法，所述页面元素包括文本类页面元素、图片类页面元素、多媒 体类页面元素。
[0256]A9、如A8所述的方法，当所述页面元素包括图片类页面元素和/或多媒体类页面 元素时，所述在各个操作页面中，接收用户插入的页面元素包括：
[0257] 在操作页面中上传本地存储的图片或者多媒体，获得在所述操作页面中的相应类 型的页面元素。
[0258]A10、如A9所述的方法，根据页面操作框架，操作页面，操作页面中的各个页面元 素，以及各个页面元素在操作页面中的位置信息，生成页面文档包括：
[0259] 将所述图片或者多媒体上传到指定服务器，并获取指定服务器中的图片或者多媒 体的网址；
[0260] 基于所述图片或者多媒体的网址，转换得到网页文档中相应页面元素代码。
[0261] 本发明公开了B11、一种页面可视化生成装置，包括：
[0262] 页面操作框架启动模块，适于启动页面操作框架；所述页面操作框架中包括至少 一个操作页面；
[0263] 页面元素插入模块，适于在各个操作页面中，接收用户插入的页面元素，并确定所 述页面元素在所述操作页面中的位置信息；
[0264] 页面生成模块，适于根据页面操作框架，操作页面，操作页面中的各个页面元素， 以及各个页面元素在操作页面中的位置信息，生成页面文档。
[0265]B12、如B11所述的装置，在页面元素插入模块之后，还包括
[0266] 编辑模块，适于接收对所述页面元素的编辑操作，并确定编辑操作后的页面元素 在操作页面中的位置信息。
[0267]B13、如B12所述的装置，所述编辑模块包括：
[0268] 元素拖拽模块，适于接收用户对所述操作页面中的页面元素的拖拽操作，并根据 所述拖拽操作重新确定所述页面元素在所述页面操作框架中的位置信息。
[0269]B14、如B11或B12所述的装置，在页面元素插入模块之后，还包括：
[0270] 第一翻页模块，适于如果所述页面操作框架包括多个操作页面，接收对操作页面 的翻页操作，在进入所述翻页操作指示的操作页面之后，在所述操作页面中接收用户插入 的页面元素。
[0271]B15、如B11或B12所述的装置，在页面元素插入模块之后，还包括：
[0272] 第二翻页模块，适于接收对操作页面的翻页操作，当所述翻页操作指示的操作页 面不存在，则在所述页面操作框架中添加一个新的操作页面，在所述新的操作页面中接收 用户插入的页面元素。
[0273]B16、如B11所述的装置，所述页面生成模块包括：
[0274] 标签转换模块，适于标签转换模块针对页面操作框架对生成body标签，针对每个 操作页面生成一个父div标签，针对操作页面中的每个页面元素生成该操作页面的父div 标签的子div标签；
[0275]内容转换模块，适于在每个子div标签中，针对相应的页面元素内容，生成相应的 元素标签以及元素内容代码；
[0276] CSS位置信息确定模块，适于根据各个页面元素在操作页面中的位置信息，各操作 页面在页面操作框架中的位置信息，确定每个父div标签和每个子div标签的CSS位置信 息；
[0277] 文档转换模块，适于根据所述body标签、所述父div标签、所述子div标签、每个 父div标签和每个子div标签的CSS位置信息，生成页面文档。
[0278]B17、如B11所述的装置，在页面生成模块之后，还包括：
[0279] 文档导出模块，适于接收对所述页面文档的导出操作；
[0280] 或者，线上发布模块，适于针对所述页面文档生成对应的访问网址。
[0281]B18、如B11所述的装置，所述页面元素包括文本类页面元素、图片类页面元素、多 媒体类页面元素。
[0282]B19、如B18所述的装置，当所述页面元素包括图片类页面元素和/或多媒体类页 面元素时，所述页面元素插入模块包括：
[0283] 上传模块，适于在操作页面中上传本地存储的图片或者多媒体，获得在所述操作 页面中的相应类型的页面元素。
[0284]B20、如B19所述的装置，所述页面生成模块包括：
[0285] 元素上传模块，适于将所述图片或者多媒体上传到指定服务器，并获取指定服务 器中的图片或者多媒体的网址；
[0286] 元素转换模块，适于基于所述图片或者多媒体的网址，转换得到网页文档中相应 页面元素代码。
【主权项】
1. 一种页面可视化生成方法，包括： 启动页面操作框架；所述页面操作框架中包括至少一个操作页面； 在各个操作页面中，接收用户插入的页面元素，并确定所述页面元素在所述操作页面 中的位置信息； 根据页面操作框架，操作页面，操作页面中的各个页面元素，以及各个页面元素在操作 页面中的位置信息，生成页面文档。2. 根据权利要求1所述的方法，其特征在于，在所述页面操作框架中，接收用户插入的 页面元素之后，还包括 接收对所述页面元素的编辑操作，并确定编辑操作后的页面元素在操作页面中的位置 信息。3. 根据权利要求2所述的方法，其特征在于，所述接收对所述页面元素的编辑操作，并 确定编辑操作后的页面元素在操作页面中的位置信息包括： 接收用户对所述操作页面中的页面元素的拖拽操作，并根据所述拖拽操作重新确定所 述页面元素在所述页面操作框架中的位置信息。4. 根据权利要求1或2所述的方法，其特征在于， 如果所述页面操作框架包括多个操作页面，则在各个操作页面中，接收用户插入的页 面元素之后，还包括： 接收对操作页面的翻页操作，在进入所述翻页操作指示的操作页面之后，在所述操作 页面中接收用户插入的页面元素。5. 根据权利要求1或2所述的方法，其特征在于，所述在各个操作页面中，接收用户插 入的页面元素之后，还包括： 接收对操作页面的翻页操作，当所述翻页操作指示的操作页面不存在，则在所述页面 操作框架中添加一个新的操作页面，在所述新的操作页面中接收用户插入的页面元素。6. 根据权利要求1所述的方法，其特征在于，根据页面操作框架，操作页面，操作页面 中的各个页面元素，操作页面在页面操作框架中的位置信息，以及各个页面元素在操作页 面中的位置信息，生成页面文档，包括： 针对页面操作框架对生成body标签，针对每个操作页面生成一个父div标签，针对操 作页面中的每个页面元素生成该操作页面的父div标签的子div标签； 在每个子div标签中，针对相应的页面元素内容，生成相应的元素标签以及元素内容 代码； 根据各个页面元素在操作页面中的位置信息，各操作页面在页面操作框架中的位置信 息，确定每个父div标签和每个子div标签的CSS位置信息； 根据所述body标签、所述父div标签、所述子div标签、每个父div标签和每个子div标签的CSS位置信息，生成页面文档。7. 根据权利要求1所述的方法，其特征在于，在生成页面文档之后，还包括： 接收对所述页面文档的导出操作； 或者，针对所述页面文档生成对应的访问网址。8. 根据权利要求1所述的方法，其特征在于，所述页面元素包括文本类页面元素、图片 类页面元素、多媒体类页面元素。9. 根据权利要求8所述的方法，其特征在于， 当所述页面元素包括图片类页面元素和/或多媒体类页面元素时，所述在各个操作页 面中，接收用户插入的页面元素包括： 在操作页面中上传本地存储的图片或者多媒体，获得在所述操作页面中的相应类型的 页面元素。10. -种页面可视化生成装置，包括： 页面操作框架启动模块，适于启动页面操作框架；所述页面操作框架中包括至少一个 操作页面； 页面元素插入模块，适于在各个操作页面中，接收用户插入的页面元素，并确定所述页 面元素在所述操作页面中的位置信息； 页面生成模块，适于根据页面操作框架，操作页面，操作页面中的各个页面元素，以及 各个页面元素在操作页面中的位置信息，生成页面文档。
【专利摘要】本发明公开了一种页面可视化生成方法和装置，涉及网页技术领域。所述方法包括：启动页面操作框架；所述页面操作框架中包括至少一个操作页面；在各个操作页面中，接收用户插入的页面元素，并确定所述页面元素在所述操作页面中的位置信息；根据页面操作框架，操作页面，操作页面中的各个页面元素，以及各个页面元素在操作页面中的位置信息，生成页面文档。本发明解决了通过编辑源代码获得网页文档的开发方式下，编辑过程麻烦，效率低的问题，取得了能够以可视化的方式编辑网页元素，快速获得网页文档，开发过程简单、效率高的有益效果。
【IPC分类】G06F9/44, G06F17/30
【公开号】CN104932889
【申请号】CN201510330616
【发明人】康永威, 金小芳, 毛帅, 任建峰, 肖宁宁
【申请人】北京奇虎科技有限公司, 奇智软件（北京）有限公司
【公开日】2015年9月23日
【申请日】2015年6月15日