具有标签的多行文本显示方法、装置、存储介质和电子设备制造方法及图纸

本发明专利技术公开了一种具有标签的多行文本显示方法、装置、存储介质和电子设备，其中方法包括：利用当前页面中设置的第一浮动标签，对第二浮动标签中的标签定位；在所述当前页面中设置第三标签，所述第三标签用于隐藏文本的部分内容。解决了用于展示文本的页面受到展示空间、展示范围的约束，直接设置超出展示空间、展示范围的文本为隐藏，并显示省略号的方式造成的省略号压住了部分文字的技术问题。实现了多行文本显示存在溢出时，标签前文本省略，且表示文档省略的省略号不会遮挡文字的技术效果。相比CSS通过webkit

【技术实现步骤摘要】
具有标签的多行文本显示方法、装置、存储介质和电子设备


[0001]本专利技术涉及文本处理领域，尤其是一种具有标签的多行文本显示方法、装置、存储介质和电子设备。

技术介绍

[0002]文本进行显示时，用于展示文本的页面具有展示空间、展示范围的约束。展示文本受到展示空间、展示范围的约束，造成文本内容无法全部显示的场景较多，以某APP的微信推送监控日报功能为例，该功能是将某APP的监控功能与微信进行绑定，实现信息的推送，微信能够每天向用户推送监控日报，由于展示的文本内容较多，多以多行显示的方式在页面中进行显示，具有仅显示部分文本，并在显示的部分文本后显示标记该文本的标签的显示需求。
[0003]为了提高用户观看文本的用户体验，现有技术中会采用将文本截断的方式，对超出显示空间、展示范围的文本进行省略展示，使用的实现方案往往是直接将超出限制行数限制的文本设置为隐藏，并在显示出的文本后增加省略号，以及在能够显示的行的最后一行的右下角，设置对该文本进行概括或说明的标签，即直接定位一个省略号及标签的显示效果往往如图1所示，图1显示了多行文本显示效果，其中，在某多行文本显示页面，对多行文本溢出进行了处理，在公司详情页的行政许可维度，其处理方式是将超出限制行数的文本隐藏，在能够显示的最后一行的右下方定位了标签，该方案由于字体的宽度的不确定，产生了省略号压住了部分文字的效果。现有的CSS样式可以实现固定长度内的单行文本溢出省略和固定行内的多行文本溢出省略，但CSS样式的实现方式，其兼容性不好。

技术实现思路

[0004]有鉴于此，本专利技术提供了一种具有标签的多行文本显示方法、装置、存储介质和电子设备，能够解决用于展示文本的页面受到展示空间、展示范围的约束，直接设置超出展示空间、展示范围的文本为隐藏，并显示省略号的方式造成的省略号压住了部分文字的技术问题。
[0005]本专利技术提供一种具有标签的多行文本显示方法。所述方法包括：利用当前页面中设置的第一浮动标签，对第二浮动标签中的标签定位；在所述当前页面中设置第三标签，所述第三标签用于隐藏文本的部分内容。
[0006]可选地，所述标签为对文本节点对应的文本进行概括或说明的标签，所述文本节点是指待显示的一条文本的文本内容对应的节点。
[0007]可选地，当前页面的显示模式包括直接显示模式及具有标签的多行文本显示模式；所述直接显示模式，是在所述当前页面中，直接显示该文本的全部文本内容；所述具有标签的多行文本显示模式，是在所述当前页面中，采用具有标签的多行文本显示方式显示该文本的部分文本内容。
[0008]可选地，基于所述标签在所述第二浮动标签中的位置，确定所述第一浮动标签的
行数；所述第一浮动标签的属性设置为清除浮动。
[0009]可选地，所述第三标签位于所述第二浮动标签之后；所述第二浮动标签中所述标签之后的文本内容、所述第三标签中的文本内容设置为隐藏。
[0010]可选地，所述第一浮动标签的内容为空。
[0011]可选地，在所述标签之前，增加省略号。
[0012]本专利技术提供一种具有标签的多行文本显示装置。所述装置包括：标签定位模块：配置为利用当前页面中设置的第一浮动标签，对第二浮动标签中的标签定位；隐藏模块：配置为在所述当前页面中设置第三标签，所述第三标签用于隐藏文本的部分内容。
[0013]本专利技术提供一种存储介质，所述存储介质中存储有多条指令；所述多条指令，用于由处理器加载并执行如前任一项所述方法。
[0014]本专利技术提供一种电子设备，所述电子设备，包括：处理器，用于执行多条指令；存储器，用于存储多条指令；其中，所述多条指令，用于由所述存储器存储，并由所述处理器加载并执行如前任一项所述方法。
[0015]本专利技术通过设置标签，在标签中显示文本内容，基于显示页面能够显示的文本行数，通过高度对比，利用浮动标签的特性，实现了多行文本显示存在溢出时，标签前文本省略，且表示文档省略的省略号不会遮挡文字的技术效果。相比CSS通过webkit
‑
box和webkit
‑
line
‑
clamp实现的多行文本溢出的解决方案，本专利技术能够较好地兼容各种浏览器。
[0016]下面通过附图和实施例，对本专利技术的技术方案做进一步的详细描述。
附图说明
[0017]通过结合附图对本专利技术实施例进行更详细的描述，本专利技术的上述以及其他目的、特征和优势将变得更加明显。附图用来提供对本专利技术实施例的进一步理解，并且构成说明书的一部分，与本专利技术实施例一起用于解释本专利技术，并不构成对本专利技术的限制。在附图中，相同的参考标号通常代表相同部件或步骤。
[0018]图1是现有技术的直接定位一个省略号及标签的显示效果示意图；图2是本专利技术一示例性实施例提供的具有标签的多行文本显示方法的流程示意图；图3是本专利技术一示例性实施例提供的具有标签的多行文本显示方法的显示效果示意图；图4是本专利技术一示例性实施例提供的具有标签的多行文本显示方法中设置标签的效果示意图；图5是本专利技术一示例性实施例提供的具有标签的多行文本显示方法中设置第二浮动标签的效果示意图；图6是本专利技术一示例性实施例提供的具有标签的多行文本显示方法中第一浮动标签对标签定位的效果示意图；
图7是本专利技术一示例性实施例提供的具有标签的多行文本显示方法中第三标签隐藏多行文本的部分内容的效果示意图；图8是本专利技术一示例性实施例提供的具有标签的多行文本显示方法中在标签前添加省略号的效果示意图；图9是本专利技术一示例性实施例提供的具有标签的多行文本显示装置的结构示意图；图10是本专利技术一示例性实施例提供的电子设备的结构。
具体实施方式
[0019]下面，将参考附图详细地描述根据本专利技术的示例实施例。显然，所描述的实施例仅仅是本专利技术的一部分实施例，而不是本专利技术的全部实施例，应理解，本专利技术不受这里描述的示例实施例的限制。
[0020]应注意到：除非另外具体说明，否则在这些实施例中阐述的部件和步骤的相对布置、数字表达式和数值不限制本专利技术的范围。
[0021]本领域技术人员可以理解，本专利技术实施例中的“第一”、“第二”、“S1”、“S2”等术语仅用于区别不同步骤、设备或模块等，既不代表任何特定技术含义，也不表示它们之间的必然逻辑顺序。
[0022]还应理解，在本专利技术实施例中，“多个”可以指两个或两个以上，“至少一个”可以指一个、两个或两个以上。
[0023]还应理解，对于本专利技术实施例中提及的任一部件、数据或结构，在没有明确限定或者在前后文给出相反启示的情况下，一般可以理解为一个或多个。
[0024]另外，本专利技术中术语“和/或”，仅仅是一种描述关联对象的关联关系，表示可以存在三种关系，例如，A和/或B，可以表示：单独存在A，同时存在A和B，单独存在B这三种情况。另外，本专利技术中字符“/”，一般表示前后关联对象是一种“或”的关系。
[0025]还应理解，本专利技术对各个实施例的描述着重强调各个实施例之间的不同之处，其本文档来自技高网...

【技术保护点】

【技术特征摘要】
1.一种具有标签的多行文本显示方法，其特征在于，包括：利用当前页面中设置的第一浮动标签，对第二浮动标签中的标签定位；在所述当前页面中设置第三标签，所述第三标签用于隐藏文本的部分内容。2.如权利要求1所述的方法，其特征在于，所述标签为对文本节点对应的文本进行概括或说明的标签，所述文本节点是指待显示的一条文本的文本内容对应的节点。3.如权利要求2所述的方法，其特征在于，当前页面的显示模式包括直接显示模式及具有标签的多行文本显示模式；所述直接显示模式，是在所述当前页面中，直接显示该文本的全部文本内容；所述具有标签的多行文本显示模式，是在所述当前页面中，采用具有标签的多行文本显示方式显示该文本的部分文本内容。4.如权利要求3所述的方法，其特征在于，基于所述标签在所述第二浮动标签中的位置，确定所述第一浮动标签的行数；所述第一浮动标签的属性设置为清除浮动。5.如权利要求4所述的方法，其特征在于，所述第三标签位于所述第二浮动标签之后；所述第二浮动标签中所述...

【专利技术属性】
技术研发人员：刘鑫磊，贾三庆，
申请(专利权)人：北京金堤科技有限公司，
类型：发明
国别省市：