CN110020316A - 一种列表的显示方法及装置 - Google Patents

Abstract

本发明公开了一种列表的显示方法及装置，所述方法包括：接收用户输入的图标信息、每一行的标题内容和每一行的附加信息，将标题内容和附加信息写入HTML文档中；将图标信息写入CSS文档中；根据CSS文档中保存的附加信息的样式信息，按照对应样式显示每一行的附加信息；根据CSS文档中保存的标题内容的显示位置信息，在对应的位置显示每一行的标题内容；根据CSS文档中保存的图标信息的显示位置信息，在对应的位置显示每一行的图标信息。由于在本发明实施例中，将图标信息写入CSS文档中，并且CSS文档中只写有一个图标信息，因此减少了HTML文档和CSS文档总的代码量，使得占用带宽资源较少，降低了系统负荷。

Description

一种列表的显示方法及装置

技术领域

本发明涉及列表显示领域，尤其涉及一种列表的显示方法及装置。

背景技术

网页中经常会用到列表来显示多条相同格式不同内容的信息，列表中通常包含列表图标、标题文本、附加信息。附加信息包括时间、内容分类、其他操作按钮等，通常使用超文本标记语言(Hyper Text Markup Language，HTML)和层叠样式表(Cascading StyleSheets，CSS)对列表样式进行控制。HTML用于定义页面元素的内容；CSS用于控制页面元素的样式。

目前常用的列表的显示方法为：将待显示列表的每一行的图标信息、标题内容和附加信息写入HTML文档中，将图标信息所属的标签的样式信息、标题内容所属的标签的样式信息以及附加信息所属的标签的样式信息写入CSS文档中，进而根据CSS文档中的样式信息，显示HTML文档中的每一行的图标信息、标题内容和附加信息。

一般，列表中多行内容是对应同一个图标信息的，而现有技术中是将图标信息写在了HTML文档中，这样，列表中每一行中都包括图标信息，HTML文档就会有多个重复的图标信息，使得HTML文档和CSS文档总的代码量较大，占用带宽资源较多，系统负荷较大。

发明内容

本发明实施例提供了一种列表的显示方法及装置，用以解决现有技术中列表显示时HTML文档和CSS文档总的代码量较大，占用带宽资源较多，系统负荷较大的问题。

本发明实施例提供了一种列表的显示方法，所述方法包括：

接收用户输入的待显示列表的图标信息、每一行的标题内容和每一行的附加信息，将所述每一行的标题内容和每一行的附加信息写入超文本标记语言HTML文档中；将所述图标信息写入与所述HTML文档对应的层叠样式表CSS文档中；

根据写入到所述HTML文档中的每一行的附加信息及所述CSS文档中保存的每一行的附加信息的样式信息，按照对应样式显示每一行的附加信息；根据写入到所述HTML文档中的每一行的标题内容及所述CSS文档中保存的每一行的标题内容的显示位置信息，在对应的位置显示每一行的标题内容；根据写入到所述CSS文档中的图标信息及所述CSS文档中保存的图标信息的显示位置信息，在对应的位置显示每一行的图标信息。

进一步地，所述附加信息包括：

时间信息和/或内容分类信息。

进一步地，所述附加信息的样式信息包括：

附加信息的浮动显示样式信息。

进一步地，所述标题内容的显示位置信息包括：

标题内容与列表左侧边框的距离信息，或者标题内容与列表右侧边框的距离信息。

进一步地，所述图标信息的显示位置信息包括：

图标信息在水平方向和垂直方向的显示位置信息。

进一步地，所述将所述每一行的标题内容和每一行的附加信息写入HTML文档中包括：

针对每一行的标题内容和附加信息，在HTML文档中，将该行的附加信息写在该行的标题内容之前。

进一步地，所述方法还包括：

接收用户输入的更新后的目标图标信息，采用所述目标图标信息对写入CSS文档中的图标信息进行更新；

根据更新后的所述CSS文档中的目标图标信息及所述CSS文档中保存的图标信息的显示位置信息，将列表中每一行的图标信息更新为所述目标图标信息。

另一方面，本发明实施例提供了一种列表的显示装置，所述装置包括：

接收写入模块，用于接收用户输入的待显示列表的图标信息、每一行的标题内容和每一行的附加信息，将所述每一行的标题内容和每一行的附加信息写入HTML文档中；将所述图标信息写入与所述HTML文档对应的CSS文档中；

显示模块，用于根据写入到所述HTML文档中的每一行的附加信息及所述CSS文档中保存的每一行的附加信息的样式信息，按照对应样式显示每一行的附加信息；根据写入到所述HTML文档中的每一行的标题内容及所述CSS文档中保存的每一行的标题内容的显示位置信息，在对应的位置显示每一行的标题内容；根据写入到所述CSS文档中的图标信息及所述CSS文档中保存的图标信息的显示位置信息，在对应的位置显示每一行的图标信息。

进一步地，所述接收写入模块，具体用于将所述每一行的时间信息和/或内容分类信息写入HTML文档中。

进一步地，所述显示模块，具体用于根据写入到所述HTML文档中的每一行的附加信息及所述CSS文档中保存的每一行的附加信息的浮动显示样式信息，按照对应样式显示每一行的附加信息。

进一步地，所述显示模块，具体用于根据写入到所述HTML文档中的每一行的标题内容及所述CSS文档中保存的每一行的标题内容与列表左侧边框的距离信息，或者标题内容与列表右侧边框的距离信息，在对应的位置显示每一行的标题内容。

进一步地，所述显示模块，具体用于根据写入到所述CSS文档中的图标信息及所述CSS文档中保存的图标信息在水平方向和垂直方向的显示位置信息，在对应的位置显示每一行的图标信息。

进一步地，所述接收写入模块，具体用于针对每一行的标题内容和附加信息，在HTML文档中，将该行的附加信息写在该行的标题内容之前。

进一步地，所述装置还包括：

更新模块，用于接收用户输入的更新后的目标图标信息，采用所述目标图标信息对写入CSS文档中的图标信息进行更新；根据更新后的所述CSS文档中的目标图标信息及所述CSS文档中保存的图标信息的显示位置信息，将列表中每一行的图标信息更新为所述目标图标信息。

本发明实施例提供了一种列表的显示方法及装置，所述方法包括：接收用户输入的待显示列表的图标信息、每一行的标题内容和每一行的附加信息，将所述每一行的标题内容和每一行的附加信息写入超文本标记语言HTML文档中；将所述图标信息写入与所述HTML文档对应的CSS文档中；根据写入到所述HTML文档中的每一行的附加信息及所述CSS文档中保存的每一行的附加信息的样式信息，按照对应样式显示每一行的附加信息；根据写入到所述HTML文档中的每一行的标题内容及所述CSS文档中保存的每一行的标题内容的显示位置信息，在对应的位置显示每一行的标题内容；根据写入到所述CSS文档中的图标信息及所述CSS文档中保存的图标信息的显示位置信息，在对应的位置显示每一行的图标信息。由于在本发明实施例中，将图标信息写入HTML文档对应的CSS文档中，并且CSS文档中只写有一个图标信息，因此减少了HTML文档和CSS文档总的代码量，使得占用带宽资源较少，降低了系统负荷。

附图说明

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

图1为本发明实施例提供的一种列表的显示过程示意图；

图2为本发明实施例4提供的列表显示效果图；

图3为本发明实施例4提供的另一个列表显示效果图；

图4为本发明实施例提供的一种列表的显示装置结构示意图。

具体实施方式

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

实施例1：

图1为本发明实施例提供的一种列表的显示过程示意图，该过程包括以下步骤：

S101：接收用户输入的待显示列表的图标信息、每一行的标题内容和每一行的附加信息，将所述每一行的标题内容和每一行的附加信息写入HTML文档中；将所述图标信息写入与所述HTML文档对应的CSS文档中。

本发明实施例提供的列表的显示方法应用于电子设备，电子设备包括PC、平板电脑等设备。

用户向电子设备中输入待显示列表的图标信息、每一行的标题内容和每一行的附加信息，电子设备将用户输入的每一行的标题内容和每一行的附加信息写入HTML文档中。电子设备中保存有与该HTML文档对应的CSS文档，电子设备将用户输入的图标信息写入与HTML文档对应的CSS文档中。

S102：根据写入到所述HTML文档中的每一行的附加信息及所述CSS文档中保存的每一行的附加信息的样式信息，按照对应样式显示每一行的附加信息；根据写入到所述HTML文档中的每一行的标题内容及所述CSS文档中保存的每一行的标题内容的显示位置信息，在对应的位置显示每一行的标题内容；根据写入到所述CSS文档中的图标信息及所述CSS文档中保存的图标信息的显示位置信息，在对应的位置显示每一行的图标信息。

CSS文档中保存有每一行的附加信息的样式信息、每一行的标题内容的显示位置信息和图标信息的显示位置信息。电子设备将每一行的标题内容和每一行的附加信息写入HTML文档中，并且将图标信息写入与HTML文档对应的CSS文档中之后，电子设备根据写入到HTML文档中的每一行的附加信息及CSS文档中保存的每一行的附加信息的样式信息，按照对应样式显示每一行的附加信息。其中，每一行的附加信息的样式信息可以为浮动显示样式信息、倾斜显示样式信息、加粗显示样式信息等等。电子设备根据写入到HTML文档中的每一行的标题内容及CSS文档中保存的每一行的标题内容的显示位置信息，在对应的位置显示每一行的标题内容。根据写入到CSS文档中的图标信息及CSS文档中保存的图标信息的显示位置信息，在对应的位置显示每一行的图标信息。至此，可以完成待显示列表的显示。

由于在本发明实施例中，将图标信息写入HTML文档对应的CSS文档中，并且CSS文档中只写有一个图标信息，因此减少了HTML文档和CSS文档总的代码量，使得占用带宽资源较少，降低了系统负荷。

实施例2：

在上述实施例的基础上，在本发明实施例中，所述附加信息包括：

时间信息和/或内容分类信息。

时间信息可以是2017年5月5日，内容分类信息可以是运动、医疗、盘点、健康等等。

为了使每一行的附加信息清楚醒目，在本发明实施例中，所述附加信息的样式信息包括：

附加信息的浮动显示样式信息。

其中，附加信息的浮动显示样式信息可以为在标题内容的右侧浮动显示，也可以为在标题内容的左侧浮动显示。

例如，HTML文档中保存的待显示列表的内容信息为<li><span>盘点</span>较真五月5大食药谣言盘点</li>。其中，“盘点”为附加信息，“较真五月5大食药谣言盘点”为标题内容，与该HTML文档对应的CSS文档中保存的附加信息的样式信息为span{float：right}，则表示“盘点”两个字在标题内容的右侧浮动显示。

实施例3：

在上述各实施例的基础上，在本发明实施例中，所述标题内容的显示位置信息包括：

标题内容与列表左侧边框的距离信息，或者标题内容与列表右侧边框的距离信息。

例如，HTML文档中保存的待显示列表的内容信息为<li><span>盘点</span>较真五月5大食药谣言盘点</li>。与该HTML文档对应的CSS文档中保存的标题内容的显示位置信息为li{padding-left:1em}，则表示标题内容与列表左侧边框的距离为一个字符。

实施例4：

在上述各实施例的基础上，在本发明实施例中，所述图标信息的显示位置信息包括：

图标信息在水平方向和垂直方向的显示位置信息。

例如，HTML文档中保存的待显示列表的内容信息为<li><span>盘点</span>较真五月5大食药谣言盘点</li>。与该HTML文档对应的CSS文档中保存的图标信息，以及图标信息的显示位置信息为li{background-image:url(list_icon.gif)；background-position:left center}，则表示图标信息为list_icon.gif所对应的图标，图标信息的显示位置信息为水平居左，垂直居中。

在本发明实施例中，如果HTML文档中保存的待显示列表的内容信息为<li><span>盘点</span>较真五月5大食药谣言盘点</li>，与该HTML文档对应的CSS文档中保存的信息为span{float：right}；li{padding-left:1em}；li{background-image:url(list_icon.gif)；background-position:left center}，则列表显示效果图如图2所示，图标信息为点状图标，标题内容“较真五月5大食药谣言盘点”与列表左侧边框的距离为一个字符，附加信息“盘点”在标题内容的右侧浮动显示。

另外，列表一般包括多行内容，在HTML文档中可以输入每一行的标题内容和每一行的附加信息，如图3所示，列表包括三行内容，第一行的标题内容“较真五月5大食药谣言盘点”，第一行的附加信息为“盘点”；第二行的标题内容“食盐添加剂是灭种计划？谣言！”，第二行的附加信息为“健康”；第三行的标题内容“注胶又生虫？虾：这锅我不背”，第二行的附加信息为“健康”。

实施例5：

在将每一行的标题内容和每一行的附加信息写入HTML文档中时，针对每一行的标题内容和附加信息，在HTML文档中，如果将该行的附加信息写在该行的标题内容之后，针对某些低版本浏览器，如IE7及更低版本的IE浏览器，则会出现列表显示不兼容的问题，为了解决列表显示不兼容的问题，在上述各实施例的基础上，在本发明实施例中，所述将所述每一行的标题内容和每一行的附加信息写入HTML文档中包括：

针对每一行的标题内容和附加信息，在HTML文档中，将该行的附加信息写在该行的标题内容之前。

如果HTML文档中保存的待显示列表的内容信息为<li>较真五月5大食药谣言盘点<span>盘点</span></li>。附加信息“盘点”写在标题内容“较真五月5大食药谣言盘点”之后，针对IE7及更低版本的IE浏览器，则会出现列表显示不兼容的问题，因此，在本发明实施例中，HTML文档中保存的待显示列表的内容信息为<li><span>盘点</span>较真五月5大食药谣言盘点</li>。附加信息“盘点”写在标题内容“较真五月5大食药谣言盘点”之前，这样便解决了列表显示不兼容的问题。

实施例6：

在上述各实施例的基础上，在本发明实施例中，所述方法还包括：

接收用户输入的更新后的目标图标信息，采用所述目标图标信息对写入CSS文档中的图标信息进行更新；

根据更新后的所述CSS文档中的目标图标信息及所述CSS文档中保存的图标信息的显示位置信息，将列表中每一行的图标信息更新为所述目标图标信息。

当用户想要对列表的图标信息进行更新时，用户向电子设备输入更新后的目标图标信息，电子设备接收用户输入的该目标图标信息，采用该目标图标信息对写入CSS文档中的图标信息进行更新。然后根据更新后的CSS文档中的目标图标信息及CSS文档中保存的图标信息的显示位置信息，将列表中每一行的图标信息更新为目标图标信息。由于在本发明实施例中，CSS文档中保存有一个图标信息，在对图标信息进行更新时，只需采用更新后的目标图标信息对写入CSS文档中的图标信息进行更新，进而根据更新后的CSS文档中的目标图标信息及CSS文档中保存的图标信息的显示位置信息，将列表中每一行的图标信息更新为目标图标信息，使得对图标信息的更新更加方便。

另外，用户有时需要通过电子设备搜索自己想要查看的列表信息，具体的，可以通过搜索引擎进行列表信息的搜索。在进行列表信息搜索时，用户输入搜索关键词，电子设备根据用户输入的搜索关键词，在HTML文档中的每一行的标题内容和每一行的附加信息，确定与搜索关键词对应的列表信息。

由于HTML文档中只包括每一行的标题内容和每一行的附加信息，因此，电子设备接收到用户输入的搜索关键词后，只需将搜索关键词与HTML文档中的每一行的标题内容和每一行的附加信息进行匹配，从而确定与搜索关键词对应的列表信息，而不需要将搜索关键词与图标信息进行匹配，因此，提高了确定与搜索关键词对应的列表信息的效率。

图4为本发明实施例提供的一种列表的显示装置结构示意图，该装置包括：

接收写入模块41，用于接收用户输入的待显示列表的图标信息、每一行的标题内容和每一行的附加信息，将所述每一行的标题内容和每一行的附加信息写入HTML文档中；将所述图标信息写入与所述HTML文档对应的CSS文档中；

显示模块42，用于根据写入到所述HTML文档中的每一行的附加信息及所述CSS文档中保存的每一行的附加信息的样式信息，按照对应样式显示每一行的附加信息；根据写入到所述HTML文档中的每一行的标题内容及所述CSS文档中保存的每一行的标题内容的显示位置信息，在对应的位置显示每一行的标题内容；根据写入到所述CSS文档中的图标信息及所述CSS文档中保存的图标信息的显示位置信息，在对应的位置显示每一行的图标信息。

所述接收写入模块41，具体用于将所述每一行的时间信息和/或内容分类信息写入HTML文档中。

所述显示模块42，具体用于根据写入到所述HTML文档中的每一行的附加信息及所述CSS文档中保存的每一行的附加信息的浮动显示样式信息，按照对应样式显示每一行的附加信息。

所述显示模块42，具体用于根据写入到所述HTML文档中的每一行的标题内容及所述CSS文档中保存的每一行的标题内容与列表左侧边框的距离信息，或者标题内容与列表右侧边框的距离信息，在对应的位置显示每一行的标题内容。

所述显示模块42，具体用于根据写入到所述CSS文档中的图标信息及所述CSS文档中保存的图标信息在水平方向和垂直方向的显示位置信息，在对应的位置显示每一行的图标信息。

所述接收写入模块41，具体用于针对每一行的标题内容和附加信息，在HTML文档中，将该行的附加信息写在该行的标题内容之前。

所述装置还包括：

更新模块43，用于接收用户输入的更新后的目标图标信息，采用所述目标图标信息对写入CSS文档中的图标信息进行更新；根据更新后的所述CSS文档中的目标图标信息及所述CSS文档中保存的图标信息的显示位置信息，将列表中每一行的图标信息更新为所述目标图标信息。

本发明实施例提供了一种列表的显示方法及装置，所述方法包括：接收用户输入的待显示列表的图标信息、每一行的标题内容和每一行的附加信息，将所述每一行的标题内容和每一行的附加信息写入超文本标记语言HTML文档中；将所述图标信息写入与所述HTML文档对应的CSS文档中；根据写入到所述HTML文档中的每一行的附加信息及所述CSS文档中保存的每一行的附加信息的样式信息，按照对应样式显示每一行的附加信息；根据写入到所述HTML文档中的每一行的标题内容及所述CSS文档中保存的每一行的标题内容的显示位置信息，在对应的位置显示每一行的标题内容；根据写入到所述CSS文档中的图标信息及所述CSS文档中保存的图标信息的显示位置信息，在对应的位置显示每一行的图标信息。由于在本发明实施例中，将图标信息写入HTML文档对应的CSS文档中，并且CSS文档中只写有一个图标信息，因此减少了HTML文档和CSS文档总的代码量，使得占用带宽资源较少，降低了系统负荷。

本发明是参照根据本发明实施例的方法、设备(系统)、和计算机程序产品的流程图和/或方框图来描述的。应理解可由计算机程序指令实现流程图和/或方框图中的每一流程和/或方框、以及流程图和/或方框图中的流程和/或方框的结合。可提供这些计算机程序指令到通用计算机、专用计算机、嵌入式处理机或其他可编程数据处理设备的处理器以产生一个机器，使得通过计算机或其他可编程数据处理设备的处理器执行的指令产生用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的装置。

这些计算机程序指令也可存储在能引导计算机或其他可编程数据处理设备以特定方式工作的计算机可读存储器中，使得存储在该计算机可读存储器中的指令产生包括指令装置的制造品，该指令装置实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能。

这些计算机程序指令也可装载到计算机或其他可编程数据处理设备上，使得在计算机或其他可编程设备上执行一系列操作步骤以产生计算机实现的处理，从而在计算机或其他可编程设备上执行的指令提供用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的步骤。

尽管已描述了本发明的优选实施例，但本领域内的技术人员一旦得知了基本创造性概念，则可对这些实施例作出另外的变更和修改。所以，所附权利要求意欲解释为包括优选实施例以及落入本发明范围的所有变更和修改。

显然，本领域的技术人员可以对本发明进行各种改动和变型而不脱离本发明的精神和范围。这样，倘若本发明的这些修改和变型属于本发明权利要求及其等同技术的范围之内，则本发明也意图包含这些改动和变型在内。

Claims (14)

1.一种列表的显示方法，其特征在于，所述方法包括：

接收用户输入的待显示列表的图标信息、每一行的标题内容和每一行的附加信息，将所述每一行的标题内容和每一行的附加信息写入超文本标记语言HTML文档中；将所述图标信息写入与所述HTML文档对应的层叠样式表CSS文档中；

根据写入到所述HTML文档中的每一行的附加信息及所述CSS文档中保存的每一行的附加信息的样式信息，按照对应样式显示每一行的附加信息；根据写入到所述HTML文档中的每一行的标题内容及所述CSS文档中保存的每一行的标题内容的显示位置信息，在对应的位置显示每一行的标题内容；根据写入到所述CSS文档中的图标信息及所述CSS文档中保存的图标信息的显示位置信息，在对应的位置显示每一行的图标信息。

2.如权利要求1所述的方法，其特征在于，所述附加信息包括：

时间信息和/或内容分类信息。

3.如权利要求1所述的方法，其特征在于，所述附加信息的样式信息包括：

附加信息的浮动显示样式信息。

4.如权利要求1所述的方法，其特征在于，所述标题内容的显示位置信息包括：

标题内容与列表左侧边框的距离信息，或者标题内容与列表右侧边框的距离信息。

5.如权利要求1所述的方法，其特征在于，所述图标信息的显示位置信息包括：

图标信息在水平方向和垂直方向的显示位置信息。

6.如权利要求1所述的方法，其特征在于，所述将所述每一行的标题内容和每一行的附加信息写入HTML文档中包括：

针对每一行的标题内容和附加信息，在HTML文档中，将该行的附加信息写在该行的标题内容之前。

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

接收用户输入的更新后的目标图标信息，采用所述目标图标信息对写入CSS文档中的图标信息进行更新；

根据更新后的所述CSS文档中的目标图标信息及所述CSS文档中保存的图标信息的显示位置信息，将列表中每一行的图标信息更新为所述目标图标信息。

8.一种列表的显示装置，其特征在于，所述装置包括：

接收写入模块，用于接收用户输入的待显示列表的图标信息、每一行的标题内容和每一行的附加信息，将所述每一行的标题内容和每一行的附加信息写入HTML文档中；将所述图标信息写入与所述HTML文档对应的CSS文档中；

显示模块，用于根据写入到所述HTML文档中的每一行的附加信息及所述CSS文档中保存的每一行的附加信息的样式信息，按照对应样式显示每一行的附加信息；根据写入到所述HTML文档中的每一行的标题内容及所述CSS文档中保存的每一行的标题内容的显示位置信息，在对应的位置显示每一行的标题内容；根据写入到所述CSS文档中的图标信息及所述CSS文档中保存的图标信息的显示位置信息，在对应的位置显示每一行的图标信息。

9.如权利要求8所述的装置，其特征在于，所述接收写入模块，具体用于将所述每一行的时间信息和/或内容分类信息写入HTML文档中。

10.如权利要求8所述的装置，其特征在于，所述显示模块，具体用于根据写入到所述HTML文档中的每一行的附加信息及所述CSS文档中保存的每一行的附加信息的浮动显示样式信息，按照对应样式显示每一行的附加信息。

11.如权利要求8所述的装置，其特征在于，所述显示模块，具体用于根据写入到所述HTML文档中的每一行的标题内容及所述CSS文档中保存的每一行的标题内容与列表左侧边框的距离信息，或者标题内容与列表右侧边框的距离信息，在对应的位置显示每一行的标题内容。

12.如权利要求8所述的装置，其特征在于，所述显示模块，具体用于根据写入到所述CSS文档中的图标信息及所述CSS文档中保存的图标信息在水平方向和垂直方向的显示位置信息，在对应的位置显示每一行的图标信息。

13.如权利要求8所述的装置，其特征在于，所述接收写入模块，具体用于针对每一行的标题内容和附加信息，在HTML文档中，将该行的附加信息写在该行的标题内容之前。

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

更新模块，用于接收用户输入的更新后的目标图标信息，采用所述目标图标信息对写入CSS文档中的图标信息进行更新；根据更新后的所述CSS文档中的目标图标信息及所述CSS文档中保存的图标信息的显示位置信息，将列表中每一行的图标信息更新为所述目标图标信息。