CN103019925B - JQuery选择器获取方法及装置 - Google Patents

Abstract

本申请涉及一种JQuery选择器获取方法以及装置。该方法包括：对页面元素查找标识选择器、类选择器、属性选择器和/或元素选择器；当标识选择器不存在，以及类选择器或属性选择器不满足选择器唯一性时，将不满足选择器唯一性的类选择器或属性选择器，压入当前元素的选择器压栈中；在设定级数内查找上级元素的标识选择器和/或类选择器；以及当在设定级数内或达到设定级数时查找到上级元素的标识选择器后，将上级元素的标识选择器压入选择器压栈中，以及从该选择器压栈中获取页面元素的JQuery选择器。本申请实现了多个浏览器下，对用户输入的选择器进行校验，也可以逆向获取页面元素的JQuery选择器。

Description

JQuery选择器获取方法及装置

技术领域

本申请涉及用户界面自动化测试领域，尤其涉及一种JQuery选择器获取方法及装置。

背景技术

用户界面(User interface，简称UI)自动化的页面元素抓取和定位大多是分别进行的。现有的页面元素的抓取方法，可以通过萤火虫(Firebug)的抓取工具，例如通过Firebug的超文本标记语言(HyperText Markup Language，简称HTML)代码查看器，来实现页面元素的抓取。为了抓取特定的网页元素，提高抓取网页元素的精度，需要一个可以代表该网页元素的变量来定位抓取对象。网页元素的可扩展标记(Extensible Markup Language，简称XML)路径语言(XML Path Language，简称XPath)和层叠样式表单(Cascading StyleSheet，简称CSS)就是这样一个变量。XPath由XML文档中的元素和其他元素组成的层次结构，CSS是一组格式设置规则。

页面元素的抓取和定位关键是选择器的写法，而该网页元素的变量XPath和CSS就是选择器写法的关键。页面元素的抓取就是抓取页面元素的XPath或CSS表达式。得到网页元素的XPath，可以通过Firebug插件，通过HTML代码查看器将当前页面显示为源代码，将鼠标移到选中的代码上，在代码区单击右键，选择“复制XPath”，此时即可获得为该元素的XPath值。为抓取页面元素，除了利用上述方法，还可以利用Firebug中CSS查看器，获得相应代码的CSS样式。上述页面元素层级结构XPath和CSS样式都要手工记录下来。

JQuery(Javascrīpt框架)提供了异常强大的选择器用以协助获取页面元素。JQuery元素选择器和属性选择器允许通过标签名、属性名或内容对页面元素进行选择。JQuery元素选择器具体为JQuery使用CSS选择器来选取页面元素。例如$("p")选取<p>元素。$("p.intro")选取所有类(class)＝"intro"的<p>元素。$("p#demo")选取标识(id)＝"demo"的第一个<p>元素。JQuery属性选择器具体为JQuery使用XPath表达式来选择带有给定属性的元素。例如$("[href]")选取所有带有href属性的元素。$("[href＝'#']")选取所有带有href值等于"#"的元素。$("[href！＝'#']")选取所有带有href值不等于"#"的元素。$("[href$＝'.jpg']")选取所有href值以".jpg"结尾的元素。其中，符号$定义JQuery。

因此，页面元素抓取后多采用XPath或CSS路径定位，对于页面元素的定位目前采用Automan通过在控制台(Automan console)上调用其应用程序，绑定IE浏览器，通过输入元素的层级结构如XPath或CSS路径，手工录入JQuery选择器来实现定位页面元素。

上面描述的方案，一方面需要借助Firebug工具抓取并手工记录元素层级结构，另一方面，需要再借助其它工具Automan console手工输入页面元素的层级结构通过选择器(Selector)定位页面元素。开发和测试方在UI自动化页面元素抓取和定位中辗转于多个工具页面，工作低效耗时。

并且，正如上面所描述的，现有的页面元素抓取和定位方式不统一，各用户界面(UI)自动化产品结合自身特点采用相应的查找方式来抓取和定位页面元素，如通过标识(ID)、类(class)或Xpath生成相应路径来抓取和定位页面元素，但是路径冗长，因此抓取和定位效率低。

另外，由于各测试人员对JQuery语法的不同掌握，造成手工录入JQuery选择器(selector)的结构不一致，因此页面元素的查找效率受影响，脚本运行耗时，且进行页面元素查找的软件不具备同步定位符合相应路径结构的元素的功能，因此页面元素的抓取和定位需辗转于多个工具页面，耗时且低效。因此，如何能找出精确的选择器是对页面元素抓取和定位的关键。

发明内容

本申请的目的是提供一种JQuery选择器获取方法及装置，通过精确获取JQuery选择器，以减少页面元素的抓取耗时并提高效率。

为实现上述目的，本申请提供了一种JQuery选择器获取方法。该方法包括：

对所选择的页面元素查找标识选择器、类选择器、属性选择器和/或元素选择器；

当所述页面元素的所述标识选择器不存在，以及所述类选择器或属性选择器不满足选择器唯一性时，将所述不满足选择器唯一性的所述类选择器或属性选择器，压入所述当前元素的选择器压栈中；或者，当不存在标识选择器、类选择器、属性选择器时，将所述元素选择器压入所述页面元素的选择器压栈中；

在设定级数内对所述页面元素向上查找所述页面元素的上级元素的标识选择器和/或类选择器；以及

当在设定级数内或达到所述设定级数时查找到所述上级元素的标识选择器后，将所述上级元素的标识选择器压入所述选择器压栈中，以及从该压入了所述上级元素的标识选择器的选择器压栈中获取所述页面元素的JQuery选择器。

所述的JQuery选择器获取方法还包括：当在达到设定级数时未查找到所述上级元素的标识选择器，但在所述设定级数内或达到所述设定级数时查找到的所述上级元素的类选择器满足选择器唯一性时，将所述上级元素的类选择器压入所述选择器压栈中，以及从该压入了所述上级元素的类选择器的选择器压栈获取所述页面元素的JQuery选择器。

所述的JQuery选择器获取方法还包括：当在达到设定级数时未查找到所述上级元素的标识选择器，以及在达到所述设定级数时查找到的所述上级元素的类选择器不满足选择器唯一性时，将所述上级元素的类选择器压入所述选择器压栈中，以及将该压入了所述上级元素的类选择器的选择器压栈取出选择器进行索引校验指定满足唯一性的选择器，将所述指定的满足唯一性的选择器确定为所述页面元素的JQuery选择器。

所述的JQuery选择器获取方法还包括：当所述页面元素的所述标识选择器存在，所述标识选择器确定为所述页面元素的JQuery选择器。

所述的JQuery选择器获取方法还包括：所述页面元素的类选择器或属性选择器满足选择器唯一性时，将所述满足选择器唯一性的所述页面元素的类选择器或属性选择器确定为所述页面元素的JQuery选择器。

本申请还提供了一种JQuery选择器获取装置，该装置包括：

页面元素选择器单元，用于查找所述页面元素的标识选择器、类选择器、属性选择器和/或元素选择器；

选择器唯一性校验单元，用于对所述页面元素的类选择器或者属性选择器进行唯一性校验，或者对所述页面元素向上查找所述页面元素的上级元素的类选择器进行唯一性校验；

选择器压栈单元，用于当所述页面元素的所述标识选择器不存在，以及所述类选择器或属性选择器不满足选择器唯一性时，将所述不满足选择器唯一性的所述类选择器或属性选择器，压入所述当前元素的选择器压栈中；或者当不存在标识选择器、类选择器、属性选择器时，将所述元素选择器压入所述页面元素的选择器压栈中；

上级元素选择器单元，用于在设定级数内对所述页面元素向上查找所述页面元素的上级元素的标识选择器和/或类选择器；

元素选择器确定单元，用于当所述上级元素选择器单元在设定级数内所述上级元素选择器单元查找到所述上级元素的标识选择器后，所述选择器压栈单元将所述上级元素的标识选择器压入所述选择器压栈中后，将该压入了所述上级元素的标识选择器的选择器压栈确定为所述页面元素的JQuery选择器。

本申请以插件形式实现了多浏览器下，单击某个页面元素，逆向获取该页面元素的JQuery选择器，也可以对用户输入的选择器进行校验。

附图说明

图1为本申请实施例JQuery选择器获取方法的流程图。

图2为本申请实施例JQuery选择器获取中选择器产生过程的示例框图。

图3为本申请实施例JQuery选择器获取装置的示意图。

具体实施方式

下面通过附图和实施例，对本申请实施例的技术方案做进一步的详细描述。

本申请实施例通过对当前的页面元素按照优先级进行查找标识选择器、类选择器、属性选择器和/或元素选择器，以及在设定级数内对该页面元素向上查找父级、曾祖父级元素等的标识选择器和/或类选择器，获取到的当前页面元素的JQuery选择器后，通过优化选择器获得最终的选择器。因此，本申请实施例可以点击某个页面元素后就获取Jquery选择器，避免了现有技术中，由于对选择器的获取过程复杂，从而导致的对页面元素的抓取和定位的耗时且繁复。

本申请实施例通过对页面元素进行逆向获取，获得该页面元素的JQuery选择器，然后根据获得的选择器来确定页面元素，从而实现了对页面元素的抓取和定位。页面元素的抓取和定位关键就是选择器的写法，即选择器的获取。因此本申请实施例旨在实现选择器的获取。

本申请实施例JQuery选择器获取方法和装置实际应用时，作为插件可置于浏览器Chrome(谷歌浏览器)、Firefox(火狐)4.0及以上、IE浏览器以及Safari浏览器中。本申请实施例主要应用于多浏览器页面中，对当前页面元素能够实现逆向获取该页面元素的JQuery选择器，以及可对用户输入的选择器进行校验。

参见图1所示，其为本申请实施例JQuery选择器获取方法的流程图。如图2所示，其为本申请实施例JQuery选择器获取中选择器产生过程的示例框图。其中详细描述了如何获取到JQuery选择器，示例了逆向获取当前页面元素(例如当前页面元素a)的选择器的过程，图2由图2-1和图2-2组合而成。

在实例中，打开浏览器插件，启动插件中的自动抓取功能，当光标移动到想要抓取的页面元素上并可通过点击等方式定位该页面元素，本申请实施例对该页面元素进行分析，逆向获取该页面元素的JQuery选择器。如图1和图2所示，本申请实施例JQuery选择器获取方法具体包括以下步骤：

步骤11，将选择的页面元素进行标识；

在具体应用时，如将通过鼠标等将光标移动到想要抓取的页面时，可创建显示/隐藏背景色函数将该页面元素进行高亮标识；

步骤12，查找所述页面元素的ID(标识)选择器、类(class)选择器、属性选择器和/或元素选择器(也叫标签名(Tagname)选择器)；

具体地，可按照优先级顺序查找，其中各选择器的优先级顺序依次为：ID选择器、类选择器、属性选择器和/或元素选择器。查找时，首先查找ID选择器，没有查找到，就查找类选择器，如果没有查找到类选择器，依次查找属性选择器，在属性选择器也没有查找到的情况下，查找元素选择器。

步骤13，当所述页面元素的标识选择器不存在，以及类选择器或属性选择器不满足选择器唯一性时，将不满足选择器唯一性的类选择器或属性选择器，压入所述当前元素的选择器压栈中；或者当不存在标识选择器、类选择器、属性选择器时，将所述元素选择器压入所述页面元素的选择器压栈中；

具体地，如图2所示，在查找到ID选择器后，该ID选择器为当前的页面元素的选择器，不必再进行其他选择器以及其父级以上元素的查找。如果ID选择器没有找到，将会查找类选择器，如果类选择器存在，那么不会再查找其他选择器；在类选择器存在时，判断类选择器的唯一性，当类选择器有唯一性，则将类选择器作为当前页面元素的选择器；没有唯一性，则将会将该类选择器压入当前页面元素的选择器压栈中，然后执行下面步骤14对父级以上元素的查找；如果类选择器都没有找到的情况下，将会查找属性选择器，查找到属性选择器，对其进行唯一性校验，在具有唯一性的情况下，该属性选择器压入选择器压栈，再取出选择器为当前页面元素的选择器；在没有唯一性的情况下，将该属性选择器压入当前页面元素的选择器压栈中，然后执行下面步骤14对父级以上元素开始查找。由于对于每一个页面元素都会具有tagname，因此，在没有找到当前页面元素的ID、类或者属性选择器的情况下，将tagname压入当前页面元素的选择器压栈中，然后执行下面步骤14，对父级以上元素进行选择器查找。因此，在获取当前页面元素的Jquery选择器时，在选择器压栈中一定会有一个位置压入当前页面元素的一个选择器。

步骤14，在设定级数内，对所述页面元素向上查找所述页面元素的上级元素ID选择器和/或类选择器；

在本实施例中，假定设定级数是4级，则对所述页面元素的父级元素，曾父级元素，曾曾父级元素和曾曾曾父级元素进行查找。本例中优选地向上查找4级，当然3级、2级也可以。

查找父级元素或以上元素的选择器，也是按照优先级来查找的，ID选择器是最高优先级，然后类选择器。首先查找ID选择器，在查找到的情况下，不会再查找类选择器，只有在没有查找到ID选择器的情况下，才会查找类选择器。

步骤15，当在所述设定级数内或达到所述设定级数并且查找到的所述上级元素的ID选择器时，将上级元素的ID选择器放入所述选择器压栈中，以及从该压入了所述上级元素的标识选择器的选择器压栈中获取所述页面元素的JQuery选择器；或者

当达到设定级数并且未查找到所述上级元素的标识选择器，但在所述设定级数内查找到的所述上级元素的类选择器满足选择器唯一性时，将所述设定级数内的所述上级元素的类选择器压入所述选择器压栈中，以及从该压入了所述上级元素的类选择器的选择器压栈获取所述页面元素的JQuery选择器；或者

当在达到设定级数时并且未查找到所述上级元素的标识选择器，以及在所述设定级数时查找到的所述上级元素的类选择器不满足选择器唯一性时，将达到所述设定级数时的所述上级元素的类选择器压入所述选择器压栈中，以及将该压入了所述上级元素的类选择器的选择器压栈进行索引指定满足唯一性的选择器，将所述指定的满足唯一性的选择器确定为所述页面元素的JQuery选择器。

参见图2，详细描述步骤15的过程。如上假设设定级数是4级，则对所述页面元素的父级元素、曾父级元素、曾曾父级元素和曾曾曾父级元素进行查找。

首先在父级元素查找：在查找到ID选择器的情况下，则此时将父级元素的ID选择器压入选择器压栈中，举例来说，比如选择器压栈中当前元素的位置压入的是当前页面元素的类选择器.class a，那么第二个位置压入父级元素的ID选择器例如myID后，从这个选择器压栈中获取当前页面元素的JQuery选择器是.myID.class a。

在没有找到ID选择器后，则查找类选择器，如果类选择器查找到，且满足选择器唯一性，那么此时如上所述，将类选择器例如myclassA压入选择器压栈中，再从该选择器压栈中获取页面元素的JQuery选择器是myclassA.classa。

但是，如果虽然查找到了类选择器，但是不满足选择器唯一性，那么此时，也将该类选择器例如myclassA压入选择器压栈中，但是需要进一步地向上级元素查找，即再向父级的父级、曾父级元素进行查找。同样地，如果父级元素的ID选择器和类选择器都没有找到，那么只有进一步地寻找上级元素了，即再向父级的父级，即曾父级元素进行查找。

在向曾父级元素进行查找的过程，同父级一样，也是先进行查找曾父级元素的ID选择器，如果ID存在，那么将曾父级的ID选择器例如myID2，压入选择器压栈，从该选择器压栈中获取到当前页面元素的选择器为myID2.myclassA.class a(这种情况是，当前元素位置压入的是class a，第二位置压入的是myclassA)或者myID2.classa(这种情况是父级元素没有找到任何一个选择器)。

同样地，如父级元素一样，在没有找到ID选择器后，则查找类选择器，如果类选择器查找到，且满足选择器唯一性，那么此时如上所述，将类选择器例如myclassB压入选择器压栈中，再从该选择器压栈中获取页面元素的JQuery选择器是myclassB.myclassA.class a或者myclassB.class a。

但是，如果虽然查找到了类选择器，但是不满足选择器唯一性，那么此时，也将该类选择器例如myclassB也压入选择器压栈中，但是需要进一步地向上级元素查找，即再向父级的父级的父级，即曾曾父级元素进行查找。同样地，如果曾父级元素的ID选择器和类选择器都没有找到，那么只有进一步地寻找上级元素了，即曾曾父级元素进行查找。

向上多少级查找，已经由设定级数所决定好了，例如向上4级，那么在当前元素的父级、曾父级、曾曾父级和曾曾曾父级这4级范围内查找选择器，对每一层级的查找就是先查找ID选择器，没有的情况下才查找类选择器，在类选择器不满足选择器唯一性或者ID选择器和类选择器都没有找到的情况下，在设定级数内向上重复这个过程查找。

例如查找到曾曾父级时，没有查找ID选择器，也没有查找到类选择器，则继续向上曾曾曾父级查找，如果达到设定级数(4级)的曾曾曾父级，查找到了ID选择器，例如myID3，那么压入选择器压栈后，从中获取到的当前页面元素的选择器为myID3.myclassB.myclassA.classa或者myID3.myclassB.classa。

如果曾曾曾父级没有查找到ID选择器，但查找到类选择器myclassD，并且满足唯一性，则放入选择器压栈后，再从该选择器压栈中获取页面元素的JQuery选择器，获取到的当前页面元素的JQuery选择器为myclassD.myclassB.myclassA.class a或者myclassD.myclassB.class a。

但是，如果曾曾曾父级虽然查找到了类选择器，但是不满足选择器唯一性，那么此时，将该类选择器，例如myclassD，也压入选择器压栈中，然后将从选择器压栈中取出的选择器myclassD.myclassB.myclassA.class a或者myclassD.myclassB.class进行索引校验，以指定满足唯一性的选择器作为当前页面元素的JQuery选择器：myclassD.myclassB.myclassA.class a：eq(2)或者myclassD.myclassB.class：eq(2)。

可选地，该索引校验步骤还可以对设定级数内的上级元素、当前页面元素在从选择器压栈中获取当前页面元素的选择器时进行，即在从选择器压栈中取出myclassB.myclassA.class a后，先对该选择器进行索引校验，然后将经过索引校验后的选择器myclassB.myclassA.class a作为当前页面元素的选择器。但是由于在达到设定级数的限值例如4级以前，查找的选择器都是会经过唯一性校验后才放入选择器压栈中，因此对于这些从选择器压栈中取出的选择器进行索引校验后，再作为当前页面元素的选择器，其实不会有任何影响，依然是myclassB.myclassA.class a。因为从选择器压栈中取出的选择器已经是满足唯一性的。

除了步骤15所描述的3种情况外，如图2所示，还包括：如果在设定级数4级内，不仅父级没有找到ID或类选择器，而且曾父级也没有找到ID或者类选择器，直到达到设定级数第4级上级元素曾曾曾父元素时，也没有找到ID选择器或者类选择器时，此时从当前选择器压栈中取出选择器，对其进行索引校验，经过索引校验后，执行满足唯一性的选择器，作为当前页面元素的选择器。此时，当前选择器压栈中就只有在当前页面元素获取选择器时压入的类选择器或者属性选择器或者tagname选择器。

从选择器压栈中取出选择器是之前压入多少选择器就将这些选择器组合一起取出。

上述过程中查找当前的页面元素ID、class、属性和元素选择器和向上进行的多级查找的ID和class选择器可通过获取选择器函数getJQS()来实现。

获取选择器函数getJQS()为逆向精确地获得当前选择的页面元素的JQuery选择器，即从当前页面元素，查找该页面元素的优先级最高的ID选择器，没有查找到的情况下，其次是class选择器，没有找到的情况下，再是元素自身属性的属性选择器，在没有找到的情况下，最后是元素的元素选择器。对当前元素向父级元素按照相同的优先级查找ID和class。向上查找4级，即查完当前页面元素的父级元素之外，还需要对曾父级元素、曾曾父级元素和曾曾曾父级元素利用相同的方法查找ID、class、属性或者元素选择器。

上面对父级等以上元素只查找了ID选择器或者Class选择器。这是因为元素选择器本身选择的方位比较广，不能达到缩小查找范围的目的，属性选择器一般不会出现在非常靠近曾父级的地方，这个是由于html本身语言的特性决定的。所以对于曾父级以上页面元素优先查找ID，因为ID是唯一能确定一个元素的选择器，对于缩小方位非常有帮助。如果ID选择器没有找到的话，再去查找Class选择器。所以在父级及以上元素查找到选择器只可能是一个ID选择器或者类选择器。

上述选择器唯一性的校验是现有技术，主要利用var element＝jQuery(选择器)，用这个jQuery函数，把选择器作为参数，看变量元素的返回的长度是否为1来判断，如果返回的element.length＝1，那么就证明了这个选择器选择到的元素是唯一。在此不再赘述。

上述对选择器进行索引校验指定满足唯一性的选择器的过程也是现有技术。在此简单介绍：假设已经查找到4层级(曾曾父级)选择器为myclassD.myclassB.myclassA.class a。如果当前页面元素a的TagName：A，通过for循环，遍历返回的曾曾父级的选择器myclassD.myclassB.myclassA.class a中的每个对象，通过比较当前页面元素与该选择器myclassD.myclassB.myclassA.class a的第几个对象是否相等，来确定索引值为1，例如第二位置处相等，该当前元素的选择器为：myclassD.myclassB.myclassA.class a：eq(1)。Eq()索引值从0开始。

如图1和图2所示，接着进行步骤16对所述页面元素的所述JQuery选择器通过优化选择器函数进行优化。

在上述实施例获取到当前元素的满足唯一性的选择器后，对该选择器进行优化，以便得到精简的选择器。

如图2所示，优化选择器函数optSelector()进行进一步地优化确定的一个选择器来获取精简的选择器。优化选择器函数optSelector()对上述getJQS()函数得到的选择器进行优化。

上述通过函数optSelector()优化上述getJQS()函数得到的选择器，获得精简的JQuery选择器，具体过程为：去掉上述JQuery选择器的一层级，验证去掉该层级后的所述JQuery选择器是否定位到所述页面元素。依此类推，一层一层地去掉，然后校验是否去掉该层级后的选择器是否唯一定位到该当前的页面元素，来确定能获取到的最小层级的选择器。因此本申请实施例可以实现页面元素的最小层级定位。

具体地，利用条件if(jQuery(#a.b.c d)＝＝＝jQuery(#a.c d))判断去掉其中的某一项例如b后，校验选择器唯一性，是否还是唯一定位到该当前的页面元素，如果唯一，那就是.b可有可无，就可以去掉，达到精简的目的。

例如，在实施例中，获取到的当前页面元素a的选择器为：myID3.myclassB.myclassA.class a，对该选择器进行去层级，例如去掉.myclassA层级，判断该选择器myID3.myclassB.class a的唯一性，if(jQuery(myID3.myclassB.myclassA.class a)＝jQuery(myID3.myclassB.classa))，如果判断选择器myID3.myclassB.myclassA.classa和myID3.myclassB.classa一样能唯一定位到当前元素a，那么该myID3.myclassB.class a也是当前页面元素a的一个选择器，但是可能不是最精简的，因此，可以接着去层级，例如将.myclassB去掉，判断选择器myID3.class a唯一性，如果判断选择器.myID3.class a一样能唯一定位到当前元素a，那么该myID3.class a也是当前页面元素a的一个最精简的选择器，从而获得到了最小层级的当前页面元素a的精简的选择器myID3.class a。

在去层级过程中，一般不会去掉层级是标识选择器以及当前元素的选择器层(即选择器第一位置处的选择器)，即去掉除标识选择器层级以及所述页面元素的选择器层级之外的一层级。因此，如上面描述的，myID3和classa不会被去掉。

如上所描述，本申请实施例实现了页面元素抓取和定位在同一个工具中进行，无需转换抓取工具和定位工具。

根据上述流程图，获得当前元素的选择器，经过筛选算法optSelector()优化，去掉层级，验证去掉层级后的选择器是否定位到所述页面元素来获得最终选择器：myID3.class a。

利用函数optSelector()优化上述getJQS()函数得到的选择器即去掉上述JQuery选择器的一层级，验证去掉该层级后的所述JQuery选择器是否定位到唯一页面元素的上述说明的过程，对用户输入的选择器进行同步校验，即通过去掉用户输入的选择器的层级定位到的页面元素，该页面元素通过边框高亮函数borderAll()来进行高亮，这样用户可以查看该高亮标识的元素是否是手工抓取选择器对应的页面元素，这样来验证用户输入的选择器是否正确。利用上述优化这个过程还可以对用户输入的选择器进行精简，即通过去掉用户输入的选择器的层级，优化该选择器，从而获得一个比较精简的选择器。对用户输入的选择器进行精简时，可通过边框高亮函数borderAll()来进行高亮，从而通过高亮标识方便用户验证精简的选择器同样是定位到原选择器之前可定位的元素。

本申请方法实施例实现了最小层级结构选择器，达到了页面元素的选择器逆向生成和对用户输入的选择器进行精简。

下面描述本申请方法实施例实际应用程序中所涉及的各个方法(函数)，同样所涉及的各个方法也应用于下面将描述的本申请装置实施例中。在实际应用程序中定义了选择器定位类(selector locator class)。在该类中，主要包括以下各个函数：

通过上述的各个函数，具体实现了本申请实施例。精确获得元素的JQuery选择器即上述过程中所述的查找步骤是通过getJQS()总函数进行的。

如上所示，所述对所述页面元素的父级元素、曾父级元素、曾曾父级元素和曾曾曾父级元素进行查找优先级最高的ID选择器和类选择器是分别通过获取祖先ID选择器函数getParentsID()和获取祖先类选择器函数getParentsClass()查找的。

所述将选择的页面元素进行标识具体为：通过创建显示/隐藏背景色函数将所述页面元素进行高亮标识。这样可提高用户体验。创建显示/隐藏背景色函数createFloatDiv()，即创建4个div(用来为HTML文档内大块(block-level)的内容提供结构和背景的元素)兼具背景色：当鼠标滑过某个页面元素，能模拟高亮元素的4个边框，其方式优于border(边框)设置带来的页面结构变动及outline(轮廓)设置带来的浏览器兼容问题。其中当鼠标滑过某个页面元素时是已经通过函数initiMouseHighlightEle()进行了初始化，初始化鼠标移动到元素上，高亮当前元素，函数removeMouseHighlightEle()移除鼠标移动高亮元素，通过这两个函数达到了初始化鼠标从页面元素移动/移除时可以准备进行高亮的效果。

在上述可以对用户输入的选择器进行同步校验，通过优化选择器函数optSelector()去掉用户输入的选择器的层级来定位的页面元素，可通过边框高亮函数borderAll()来进行高亮，从而通过高亮标识方便用户验证与手工抓取的页面元素是否为同一个页面元素。

如上所示，在具体应用时，本申请实施例作为插件的页面HTML和CSS是通过js(createExtensionDom)创建，插件采用js(javascript，java脚本语言)编码，实现跨平台跨浏览器使用，具有可移植性。除了上述函数之外，还定义了函数initExtensionSelfEvent()初始化插件自身的功能，包括一些交互细节；以及函数initKeyupHightlight()初始化在编辑框内，鼠标边输入，页面同步高亮功能这些辅助性的函数。在本申请实施例实际应用的插件页面中通过函数submit()可以将文本框中的selector即获取到的最大可能选择器进行高亮操作。

其中，所述属性选择器是按照预先设定的特定属性值来查找的。获取元素的属性选择器时，对元素属性，例如input[type＝button]，预留属性“白名单”，本申请实施例遵循“白名单”中存储的特定属性值，将匹配的放入选择器，此种方式避免页面因style(样式)等属性变化而发生变化，造成选择器获取的不稳定。

本申请实施例实现了在多浏览器页面中，自动抓取元素逆向获取该元素的JQuery选择器。以插件形式实现了多浏览器下，对用户输入的选择器进行校验，也可以单击某个页面元素，逆向获取该页面元素的JQueryselector。

相应地，如图3所示，本申请实施例还提供了一种JQuery选择器获取装置，该装置包括：

中心处理单元31，用于将选择的页面元素进行标识；

中心处理单元31通过创建显示/隐藏背景色函数createFloatDiv()，创建4个div(用来为HTML文档内大块(block-level)的内容提供结构和背景的元素)兼具背景色：当鼠标滑过某个页面元素，能模拟高亮元素的4个边框，其方式优于border(边框)设置带来的页面结构变动及outline(轮廓)设置带来的浏览器兼容问题。其中当鼠标滑过某个页面元素时是已经通过函数initiMouseHighlightEle()进行了初始化，初始化鼠标移动到元素上，高亮当前元素，函数removeMouseHighlightEle()移除鼠标移动高亮元素，通过这两个函数达到了初始化鼠标从页面元素移动/移除时可以准备进行高亮的效果。

页面元素选择器单元32，用于查找所述页面元素的标识选择器、类选择器、属性选择器和/或元素选择器；

选择器唯一性校验单元33，用于对所述页面元素的类选择器或者属性选择器进行唯一性校验，或者对所述页面元素向上查找所述页面元素的上级元素的类选择器进行唯一性校验；

选择器压栈单元34，用于当所述页面元素的所述标识选择器不存在，以及所述类选择器或属性选择器不满足选择器唯一性时，将所述不满足选择器唯一性的所述类选择器或属性选择器，压入所述当前元素的选择器压栈中；或者当不存在标识选择器、类选择器、属性选择器时，将所述元素选择器压入所述页面元素的选择器压栈中；

上级元素选择器单元35，用于在设定级数内对所述页面元素向上查找所述页面元素的上级元素的标识选择器和/或类选择器；

其中，设定级数优选设置为4级。所述上级元素选择器单元33是对所述页面元素的父级元素、曾父级元素、曾曾父级元素和曾曾曾父级元素进行查找。

页面元素选择器单元32和上级元素选择器单元33通过获取选择器函数getJQS()来查找ID、class、属性和元素选择器。更为具体地，上级元素选择器单元33对所述页面元素的父级元素，曾父级元素，曾曾父级元素和曾曾曾父级元素进行查找优先级最高的ID选择器和类选择器是分别通过获取祖先ID选择器函数getParentsID()和获取祖先类选择器函数getParentsClass()查找的。

元素选择器确定单元36，用于当所述上级元素选择器单元在设定级数内，或在设定级数时，且所述上级元素选择器单元查找到所述上级元素的标识选择器后，在所述选择器压栈单元将所述上级元素的标识选择器压入所述选择器压栈中后，将该压入了所述上级元素的标识选择器的选择器压栈，并确定为所述页面元素的JQuery选择器；或者

当所述上级元素选择器单元在达到设定级数时未查找到所述上级元素的标识选择器，但所述上级元素选择器单元查找到的所述上级元素的类选择器满足选择器唯一性时，在所述选择器压栈单元将所述设定级数内的所述上级元素的类选择器压入所述选择器压栈中后，将该压入了所述上级元素的类选择器的选择器压栈，并确定为所述页面元素的JQuery选择器；或者

当在达到设定级数时所述上级元素选择器单元未查找到所述上级元素的标识选择器，以及在所述设定级数内查找到的所述上级元素的类选择器不满足选择器唯一性时，在所述选择器压栈单元将所述设定级数内的所述上级元素的类选择器压入所述选择器压栈中后，将该压入了所述上级元素的类选择器的选择器压栈，进行索引后，指定满足唯一性的选择器，将所述指定的满足唯一性的选择器确定为所述页面元素的JQuery选择器。

如上面方法实施例所描述的，JQuery选择器获取装置获取JQuery选择器。如图2所示，其详细描述了如何获取到JQuery选择器，示例了抓取当前页面元素(例如当前页面元素a)的选择器的过程，在页面元素选择器单元32查找到ID选择器后，该ID选择器为当前的页面元素的选择器，不必再进行其他选择器的查找，以及父级以上元素的寻找。如果ID选择器没有找到，将会查找类选择器，如果类选择器存在，那么不会再查找其他选择器，选择器唯一性校验单元判断类选择器的唯一性，当类选择器有唯一性，则将类选择器压入当前页面元素的选择器压栈中，作为当前页面元素的选择器；没有唯一性，则将会将该类选择器压入当前页面元素的选择器压栈中，然后执行下面步骤14对父级以上元素开始查找；如果类选择器都没有找到的情况下，将会查找属性选择器，查找到属性选择器，对其进行唯一性校验，在具有唯一性的情况下，该属性选择器为当前页面元素的选择器，在没有唯一性的情况下，将该属性选择器压入当前页面元素的选择器压栈中，然后执行下面对父级以上元素开始查找；由于对于每一个页面元素都会具有tagname，因此，在没有找到当前页面元素的ID、类或者属性选择器的情况下，将tagname压入当前页面元素的选择器压栈中，然后执行下面步骤14对父级以上元素进行选择器查找。因此，在获取当前页面元素的Jquery选择器时，在选择器压栈中一定会有一个位置压入当前页面元素的一个选择器。

参见图2，如上假定设定级数是4级，则对所述页面元素的父级元素、曾父级元素、曾曾父级元素和曾曾曾父级元素进行查找。

首先在向父级元素查找：在查找到ID选择器的情况下，则此时将父级元素的ID选择器压入选择器压栈中，举例来说比如选择器压栈中当前元素的位置压入的是当前页面元素的类选择器.class a，那么第二个位置压入父级元素的ID选择器例如myID后，从这个选择器压栈中获取当前页面元素的JQuery选择器是.myID.class a。

在没有找到ID选择器后，则查找类选择器，如果类选择器查找到，且满足选择器唯一性，那么此时如上所述的那样，选择器压栈单元将类选择器例如myclassA压入选择器压栈中，再从该选择器压栈中获取页面元素的JQuery选择器是myclassA.class a。

但是，如果虽然查找到了类选择器，但是不满足选择器唯一性，那么此时，选择器压栈单元也将该类选择器例如myclassA压入选择器压栈中，但是需要进一步地向上级元素查找，即再向父级的父级、曾父级元素进行查找。同样地，如果父级元素的ID选择器和类选择器都没有找到，那么只有进一步地寻找上级元素了，即再向父级的父级、曾父级元素进行查找。

在向曾父级元素进行查找的过程，同父级一模一样，也是先进行查找曾父级元素的ID选择器，如果ID存在，那么将曾父级的ID选择器例如myID2，压入选择器压栈，从该选择器压栈中获取到当前页面元素的选择器为myID2.myclassA.class a(这种情况是当前元素位置压入的是class a，第二位置压入的是myclassA)或者myID2.classa(这种情况是父级元素没有找到任何一个选择器)。

同样地，如父级元素一样，在没有找到ID选择器后，则查找类选择器，如果类选择器查找到，且满足选择器唯一性，那么此时如上所述，选择器压栈单元将类选择器例如myclassB压入选择器压栈中，元素选择器确定单元再从该选择器压栈中获取页面元素的JQuery选择器是myclassB.myclassA.class a或者myclassB.class a。

但是，如果虽然查找到了类选择器，但不满足选择器唯一性，那么此时，也将该类选择器例如myclassB也压入选择器压栈中，但是需要进一步地向上级元素查找，即再向父级的父级的父级，曾曾父级元素进行查找。同样地，如果曾父级元素的ID选择器和类选择器都没有找到，那么只有进一步地寻找上级元素了，即曾曾父级元素进行查找。

向上多少级查找，已经由设定级数所决定好了，例如向上4级，那么在当前元素的父级、曾父级、曾曾父级和曾曾曾父级这4级范围内查找选择器，对每一层级的查找就是先查找ID选择器，没有的情况下才查找类选择器，在类选择器不满足选择器唯一性或者ID选择器和类选择器都没有找到的情况下，在设定级数内向上重复这个过程查找。

例如，在查找到曾曾父级时，没有查找ID选择器，也没有查找到类选择器，则继续向上曾曾曾父级查找，如果达到设定级数(4级)的曾曾曾父级，查找到了ID选择器，例如myID3，那么压入选择器压栈后，从中获取到的当前页面元素的选择器为myID3.myclassB.myclassA.class a或者myID3.myclassB.class a。

如果曾曾曾父级没有查找到ID选择器，但查找到类选择器myclassD，并且满足唯一性，则放入选择器压栈后，再从该选择器压栈中获取页面元素的JQuery选择器，获取到的当前页面元素的JQuery选择器为myclassD.myclassB.myclassA.class a或者myclassD.myclassB.class。

但是，如果曾曾曾父级虽然查找到了类选择器，但是不满足选择器唯一性，那么此时，也将该类选择器例如myclassD也压入选择器压栈中，然后将从选择器压栈中取出的选择器myclassD.myclassB.myclassA.class a或者myclassD.myclassB.class进行索引校验，指定满足唯一性的选择器作为当前页面元素的JQuery选择器：myclassD.myclassB.myclassA.class a：eq(2)或者myclassD.myclassB.class：eq(2)。

可选地，该索引校验步骤还可以对设定级数内的上级元素、当前页面元素在从选择器压栈中获取当前页面元素的选择器时进行，即在从选择器压栈中取出myclassB.myclassA.class a后，先对该选择器进行索引校验，然后将经过索引校验后的选择器myclassB.myclassA.class a作为当前页面元素的选择器。但是由于在达到设定级数的限值例如4级以前，查找的选择器都是会经过唯一性校验后才放入选择器压栈中，因此对于这些从选择器压栈中取出的选择器进行索引校验后再作为当前页面元素的选择器，其实不会有任何影响，依然是myclassB.myclassA.class a。因为从选择器压栈中取出的选择器已经是唯一的。

如果在设定级数4级内，上级元素选择器单元不仅父级没有找到ID或类选择器，而且曾父级也没有找到ID或者类选择器，直到达到设定级数第4级上级元素曾曾曾父元素时，也没有找到ID选择器或者类选择器时，此时元素选择器确定单元从选择器压栈中取出选择器，对其进行索引校验，经过索引校验后执行满足唯一性的选择器，作为当前页面元素的选择器。

其中，页面元素选择器单元32对属性选择器的获取是按照预先设定的特定属性值来查找的。所述特定属性值是以白名单的方式预先存储。获取元素的属性选择器时，对元素属性，例如input[type＝button]，页面元素选择器单元32和上级元素选择器单元33遵循“白名单”中存储的特定属性值，将匹配的放入选择器，此种方式避免页面因style(样式)等属性变化而发生变化，造成选择器获取的不稳定。

上面曾父级等元素只查找了ID选择器和Class选择器。图中显示曾父级以上元素只查找ID选择器和Class选择器，不查找元素选择器和属性选择器，这是因为元素选择器本身选择的方位比较广，不能达到缩小查找范围的目的，属性选择器一般不会出现在非常靠曾父级的地方，这个是由于html本身语言的特性决定的。所以对于曾父级以上页面元素优先查找id，因为id是唯一能确定一个元素的选择器，对于缩小方位非常有帮助。

选择器唯一性校验单元35对JQuery选择器唯一性校验，如上述在方法实施例中描述的。JQuery校验选择器的唯一性，如果这些选择器定位的目标元素不能唯一确定时，通过指定索引值匹配页面元素来确定最佳选择器：假设当前页面元素a的TagName A，通过for循环，通过比较当前页面元素的选择器的对象与父类元素等获取到的选择器数组中第几个对象是否相等，来确定索引值，那么该页面元素的最佳选择器即为上述确定唯一性的选择器.:eq()。其中:eq()是指目标元素不能唯一确定时，匹配一个给定索引值即第几个的元素，从0开始。

通过优化选择器函数optSelector()进行进一步地优化，来获得该页面元素的最佳选择器。

因此，进一步地，如图3所示，该JQuery选择器获取装置还包括：

选择器优化单元37，用于对所述页面元素的所述JQuery选择器通过优化选择器optselector函数进行优化。

进一步地，所述选择器优化单元37包括：

去选择器层级单元371，用于去掉所述JQuery选择器的一层级；

元素验证单元372，用于验证去掉该层级后的所述JQuery选择器是否定位到所述页面元素。

选择器优化单元36通过函数optSelector()优化上述getJQS()函数得到的选择器，具体过程为：去掉上述JQuery选择器的一层级，验证去掉该层级后的所述JQuery选择器是否定位到所述页面元素。如果没有定位到所述页面元素，则进一步去掉一层级，以此类推，因此本申请实施例可以实现页面元素的最小层级选择器。如上述方法实施例中所描述的。

通过选择器优化单元36还可以对用户输入的选择器进行精简，通过去掉用户输入的选择器的层级，优化该选择器，从而获得一个比较精简的选择器；从而方便用户验证手工输入的选择器是否精简。

选择器优化单元36在优化选择器函数optSelector()去掉用户输入的选择器的层级来精简时，可通过边框高亮函数borderAll()来进行高亮，从而通过高亮标识方便用户验证精简的选择器同样是定位到之前的元素。

选择器优化单元36，也可以对用户输入的选择器进行精简，即通过去掉用户输入的选择器的层级定位到的页面元素，该页面元素通过边框高亮函数borderAll()来进行高亮，这样用户可以查看该高亮标识的元素是否是手工抓取选择器对应的页面元素，这样来验证用户输入的选择器是否正确。

如上所描述的，本申请装置实施例实现了页面元素抓取和定位在同一个装置中进行，无需转换抓取工具和定位工具。

该装置还定义了函数initExtensionSelfEvent()初始化插件自身的功能，包括一些交互细节；以及函数initKeyupHightlight()初始化在编辑框内，鼠标边输入，页面同步高亮功能这些辅助性的函数，具体由该装置的中心处理单元来实现。在本申请装置实施例实际应用的插件页面中通过函数submit()可以将文本框中的selector即获取到的选择器进行高亮操作。

如上所示，在具体应用时本申请装置实施例作为插件，它的页面HTML和CSS是通过js(createExtensionDom)创建，插件采用js(javascript，java脚本语言)编码，实现跨平台跨浏览器使用，具有可移植性。

本申请装置实施例实现了元素的最小层级结构选择器，达到了页面元素的选择器逆向生成和对用户输入的选择器进行校验或精简。

本领域普通技术人员应该还可以进一步意识到，结合本文中所公开的实施例描述的各示例的单元及算法步骤，能够以电子硬件、计算机软件或者二者的结合来实现，为了清楚地说明硬件和软件的可互换性，在上述说明中已经按照功能一般性地描述了各示例的组成及步骤。这些功能究竟以硬件还是软件方式来执行，取决于技术方案的特定应用和设计约束条件。本领域普通技术人员可以对每个特定的应用来使用不同方法来实现所描述的功能，但是这种实现不应认为超出本申请的范围。

结合本文中所公开的实施例描述的方法或算法的步骤可以用硬件、处理器执行的软件模块，或者二者的结合来实施。软件模块可以置于随机存储器(RAM)、内存、只读存储器(ROM)、电可编程ROM、电可擦除可编程ROM、寄存器、硬盘、可移动磁盘、CD-ROM、或技术领域内所公知的任意其它形式的存储介质中。

以上所述的具体实施方式，对本申请的目的、技术方案和有益效果进行了进一步详细说明，所应理解的是，以上所述仅为本申请的具体实施方式而已，并不用于限定本申请的保护范围，凡在本申请的精神和原则之内，所做的任何修改、等同替换、改进等，均应包含在本申请的保护范围之内。

Claims (14)

1.一种JQuery选择器获取方法，其特征在于，包括：

对所选择的页面元素查找标识选择器、类选择器、属性选择器和/或元素选择器；

当所述页面元素的所述标识选择器不存在，以及所述类选择器或属性选择器不满足选择器唯一性时，将所述不满足选择器唯一性的所述类选择器或属性选择器，压入当前页面元素的选择器压栈中；或者，当不存在标识选择器、类选择器、属性选择器时，将所述元素选择器压入所述页面元素的选择器压栈中；

在设定级数内对所述页面元素向上查找所述页面元素的上级元素的标识选择器和/或类选择器；以及

当在设定级数内或达到所述设定级数时查找到所述上级元素的标识选择器后，将所述上级元素的标识选择器压入所述选择器压栈中，以及从该压入了所述上级元素的标识选择器的选择器压栈中获取所述页面元素的JAVA脚本框架JQuery选择器。

2.根据权利要求1所述的JQuery选择器获取方法，其特征在于，还包括：

当在达到设定级数时未查找到所述上级元素的标识选择器，但在所述设定级数内或达到所述设定级数时查找到的所述上级元素的类选择器满足选择器唯一性时，将所述上级元素的类选择器压入所述选择器压栈中，以及从该压入了所述上级元素的类选择器的选择器压栈获取所述页面元素的JQuery选择器。

3.根据权利要求2所述的JQuery选择器获取方法，其特征在于，还包括：

当在达到设定级数时未查找到所述上级元素的标识选择器，以及在达到所述设定级数时查找到的所述上级元素的类选择器不满足选择器唯一性时，将所述上级元素的类选择器压入所述选择器压栈中，以及将该压入了所述上级元素的类选择器的选择器压栈取出选择器进行索引校验指定满足唯一性的选择器，将所述指定的满足唯一性的选择器确定为所述页面元素的JQuery选择器。

4.根据权利要求1至3中任一项所述的JQuery选择器获取方法，其特征在于，还包括当所述页面元素的所述标识选择器存在，所述标识选择器确定为所述页面元素的JQuery选择器。

5.根据权利要求1至3中任一项所述的JQuery选择器获取方法，其特征在于，还包括所述页面元素的类选择器或属性选择器满足选择器唯一性时，将所述满足选择器唯一性的所述页面元素的类选择器或属性选择器确定为所述页面元素的JQuery选择器。

6.根据权利要求1至3中任一项所述的JQuery选择器获取方法，其特征在于，还包括当在所述设定级数内或达到所述设定级数时未查找到所述上级元素的标识或类选择器时，对所述选择器压栈取出选择器，进行索引校验指定满足唯一性的选择器，将所述指定的满足唯一性的选择器作为所述页面元素的JQuery选择器。

7.根据权利要求1至3中任一项所述的JQuery选择器获取方法，其特征在于，所述对所选择的页面元素查找标识选择器、类选择器、属性选择器和/或元素选择器具体包括：

按照优先级，依次查找所述标识选择器、类选择器、属性选择器和/或元素选择器，当未查找到所述标识选择器后，查找所述类选择器；当未查找到所述类选择器后，查找所述属性选择器；当未查找到所述属性选择器，查找所述元素选择器。

8.根据权利要求1至3中任一项所述的JQuery选择器获取方法，其特征在于，所述查找是通过获取选择器getJQS函数进行的。

9.根据权利要求1至3中任一项所述的JQuery选择器获取方法，其特征在于，所述对所述页面元素向上查找所述页面元素的上级元素的标识选择器和/或类选择器是分别通过获取祖先标识选择器函数和获取祖先类选择器函数查找的。

10.根据权利要求9所述的JQuery选择器获取方法，其特征在于，所述上级元素具体为所述页面元素的父级元素、曾父级元素、曾曾父级元素和/或曾曾曾父级元素进行查找。

11.根据权利要求3所述的JQuery选择器获取方法，其特征在于，在所述确定为所述页面元素的JQuery选择器之后还包括：

对所述页面元素的所述JQuery选择器通过优化选择器函数进行优化，

所述优化选择器函数通过去掉所述JQuery选择器的一层级，验证去掉该层级后的所述JQuery选择器是否定位到所述页面元素。

12.根据权利要求1至3中任一项所述的JQuery选择器获取方法，其特征在于，所述选择的页面元素通过创建显示/隐藏背景色函数将所述页面元素进行高亮标识。

13.根据权利要求1至3中任一项所述的JQuery选择器获取方法，其特征在于，所述属性选择器是按照预先设定的特定属性值来查找的。

14.一种JQuery选择器获取装置，其特征在于，包括：

页面元素选择器单元，用于查找所述页面元素的标识选择器、类选择器、属性选择器和/或元素选择器；

选择器唯一性校验单元，用于对所述页面元素的类选择器或者属性选择器进行唯一性校验，或者对所述页面元素向上查找所述页面元素的上级元素的类选择器进行唯一性校验；

选择器压栈单元，用于当所述页面元素的所述标识选择器不存在，以及所述类选择器或属性选择器不满足选择器唯一性时，将所述不满足选择器唯一性的所述类选择器或属性选择器，压入当前页面元素的选择器压栈中；或者当不存在标识选择器、类选择器、属性选择器时，将所述元素选择器压入所述页面元素的选择器压栈中；

上级元素选择器单元，用于在设定级数内对所述页面元素向上查找所述页面元素的上级元素的标识选择器和/或类选择器；

元素选择器确定单元，用于当所述上级元素选择器单元在设定级数内所述上级元素选择器单元查找到所述上级元素的标识选择器后，所述选择器压栈单元将所述上级元素的标识选择器压入所述选择器压栈中后，将该压入了所述上级元素的标识选择器的选择器压栈确定为所述页面元素的JQuery选择器。