[发明专利]CSS调试方法及装置

说明书

技术领域

本发明涉及信息技术领域，尤其涉及一种CSS调试方法及装置。

背景技术

开发人员在进行CSS(Cascading Style Sheets，层叠样式表)开发过程中，如果编写完成代码，还需要将编写好的代码通过浏览器打开，以便查看编写好的代码是否达到预期的效果。然而，在开发过程中，开发人员开发完成的代码很难一次性满足实际的需要，如果通过浏览器查看到编写好的代码达不到预期的效果，开发人员还需要利用浏览器提供的开发工具在线修改代码，并将修改后代码拷贝出来，粘贴到CSS源文件中保存。

由于在开发阶段通常需要不断的对CSS的样式进行调整，而每次利用浏览器提供的开发工具修改完代码后，还需要将修改后的代码拷贝出来，粘贴到CSS源文件中。这样不断地重复复制粘贴的操作，严重影响了开发人员的工作效率。

发明内容

为克服相关技术中存在的问题，本发明提供一种CSS调试方法及装置。

根据本发明实施例的第一方面，提供一种CSS调试方法，包括：

监测浏览器是否对加载的网页中CSS产生触发事件；

当监测到浏览器对加载的网页中CSS产生触发事件时，获取所述触发事件；

根据所述触发事件修改所述CSS对应的源文件。

可选地，所述根据所述触发事件修改所述CSS对应的源文件，包括：

将所述触发事件解析，得到修改信息；所述修改信息包括：修改位置和修改内容；

获取所述CSS对应的源文件；

查找所述源文件中所述修改位置上的文件内容；

根据所述修改内容修改所述文件内容。

可选地，所述获取所述触发事件，包括：

利用套接字socket方式与所述浏览器建立通信连接；

接收所述浏览器通过所述socket方式发送的所述触发事件。

可选地，在所述监测浏览器是否对加载的网页中CSS产生触发事件之前，包括：

利用所述浏览器加载所述网页；

通过所述浏览器内置的前端调试工具显示所述网页中CSS的显示内容。

可选地，还包括：

保存修改后的源文件；

将修改后的源文件备份到预设位置。

根据本发明实施例的第二方面，提供一种CSS调试装置，包括：

监测模块，用于监测浏览器是否对加载的网页中CSS产生触发事件；

触发事件获取模块，用于在监测到浏览器对加载的网页中CSS产生触发事件时，获取所述触发事件；

文件修改模块，用于根据所述触发事件修改所述CSS对应的源文件。

可选地，所述文件修改模块，包括：

解析子模块，用于将所述触发事件解析，得到修改信息；所述修改信息包括：修改位置和修改内容；

文件获取子模块，用于获取所述CSS对应的源文件；

内容查找子模块，用于查找所述源文件中所述修改位置上的文件内容；

内容修改子模块，用于根据所述修改内容修改所述文件内容。

可选地，所述触发事件获取模块，包括：

通信连接子模块，用于利用套接字socket方式与所述浏览器建立通信连接；

接收子模块，用于接收所述浏览器通过所述socket方式发送的所述触发事件。

可选地，还包括：

网页加载模块，用于利用所述浏览器加载所述网页；

内容显示模块，用于通过所述浏览器内置的前端调试工具显示所述网页中CSS的显示内容。

可选地，还包括：

文件保存模块，用于保存修改后的源文件；

文件备份模块，用于将修改后的源文件备份到预设位置。

本发明的实施例提供的技术方案可以包括以下有益效果：

本发明提供的CSS调试方法及装置，通过监测浏览器是否对加载的网页中CSS产生触发事件；当监测到浏览器对加载的网页中CSS产生触发事件时，获取所述触发事件；根据所述触发事件修改所述CSS对应的源文件。这样可以很方便解决目前网页CSS调试存在的过程繁琐、不能实时同步以及操作不便等问题，大大提高了开发人员的工作效率。

应当理解的是，以上的一般描述和后文的细节描述仅是示例性和解释性的，并不能限制本发明。

附图说明

此处的附图被并入说明书中并构成本说明书的一部分，示出了符合本发明的实施例，并与说明书一起用于解释本发明的原理。

图1是根据一示例性实施例示出的一种CSS调试方法的流程图；