网页表单布局的调整方法、装置、电子设备及存储介质.pdf

(19)国家知识产权局(12)发明专利申请(10)申请公布号CN114706572A(43)申请公布日2022.07.05(21)申请号202210316929.X(22)申请日2022.03.28(71)申请人成都新潮传媒集团有限公司地址610000四川省成都市高新区锦晖西一街99号1栋2单元15层1505号(72)发明人刘茜文(74)专利代理机构成都顶峰专利事务所(普通合伙)51224专利代理师王袁辉(51)Int.Cl.G06F8/35(2018.01)G06F8/38(2018.01)G06F16/957(2019.01)权利要求书2页说明书10页附图3页(54)发明名称网页表单布局的调整方法、装置、电子设备及存储介质(57)摘要本发明公开了一种网页表单布局的调整方法、装置、电子设备及存储介质，本发明通过调整后的网页页面的分辨率，来配置表单的布局列数，从而得到表单模板；然后，即可基于布局列数，将原网页页面中表单内的表单标签名称划分至表单模板的每一列中，从而得到渲染表单；接着，再计算出渲染表单中每一列的最大列宽，并联合表单域宽度，进行渲染表单列宽的调整，以得到调整后的渲染表单，最后，将调整后的渲染表单渲染至调整后的网页页面中，即可完成表单布局的调整；通过上述设计，本发明通过网页页面的分辨率来配置表单列参数，从而决定表单在不同分辨率下的展示列数，并且优化每一列展示的最佳宽度，由此，达到了充分利用页面空间以及整齐布局的效果。CN114706572ACN114706572A权利要求书1/2页1.一种网页表单布局的调整方法，其特征在于，包括：响应于用户进行网页页面尺寸调整操作时，获取调整后的网页页面的分辨率；基于所述分辨率，得到目标表单在所述调整后的网页页面中的布局列数，以便基于所述布局列数得到表单模板，其中，所述目标表单为尺寸调整前的网页页面中的表单；根据所述布局列数，将所述目标表单中的表单标签名称划分至所述表单模板的每一列中，以得到渲染表单；计算所述渲染表单中每一列内各个表单标签名称在调整后的网页页面中的宽度值，并将每一列中的最大宽度值作为对应列的最大列宽；获取所述目标表单的表单域宽度，并基于所述表单域宽度以及所述渲染表单中每一列的最大列宽，调整所述渲染表单，得到调整后的渲染表单；将所述调整后的渲染表单渲染到调整后的网页页面中，以完成所述目标表单在调整后的网页页面中布局的调整。2.如权利要求1所述的方法，其特征在于，根据所述布局列数，将所述目标表单中的表单标签名称划分至所述表单模板的每一列中，以得到渲染表单，包括：基于所述布局列数，对所述目标表单中的表单标签名称进行数据重构，得到列表单标签数组，其中，所述列表单标签数组中的元素总个数等于所述布局列数，且每个元素包括至少一个表单标签名称；将所述列表单标签数组中的第i个元素，存储至所述表单模板的第i列中，其中，i为正整数，且i从1开始；当i从1循环至n时，得到所述渲染表单，其中，n为所述列表单标签数组中元素的总个数。3.如权利要求2所述的方法，其特征在于，基于所述布局列数，对所述目标表单中的表单标签名称进行数据重构，得到列表单标签数组，包括：获取所述网页页面的表单项配置数据，其中，所述表单项配置数据包括多个按照顺序排列的表单标签名称；基于所述布局列数，创建一个元素内容为空的二维数组，其中，所述二维数组中的元素总个数等于所述布局列数；计算所述表单项配置数据中各个表单标签名称的排序序号，与所述二维数组中的元素总个数之间的余数，以将余数作为各个表单标签名称的存储序号，其中，余数为0对应的存储序号为m，m为所述布局列数，且任一存储序号用于表征对应表单标签名称在所述二维数组中存储的元素的排序号；基于各个表单标签名称的存储序号，将各个表单标签名称存储至所述二维数组中，得到所述列表单标签数组。4.如权利要求1所述的方法，其特征在于，计算所述渲染表单中每一列内各个表单标签名称在调整后的网页页面中的宽度值，包括：获取所述调整后的网页页面对应的DOM树中的DOM节点；按照预设规则，将所述渲染表单中每一列内的各个表单标签名称，存储至所述DOM节点中，得到多个标签节点，其中，所述预设规则为一个表单标签名称对应一个DOM节点；将所述多个标签节点中的每个标签节点渲染至所述调整后的网页页面中，以将每个标2CN114706572A权利要求书2/2页签节点在调整后的网页页面中的宽度值，作为每个表单标签名称在调整后的网页页面中的宽度值。5.如权利要求1所述的方法，其特征在于，基于所述表单域宽度以及所述渲染表单中每一列的最大列宽，调整所述渲染表单，包括：计算所述渲染表单中每一列的最大列宽与所述表单域宽度的总和，得到所述渲染表单中每一列的最佳列宽；将所述渲染表单中每一列的列宽，调整至每一列的最佳列宽，得到所述渲染表单。