CSS选择器生成_JavaScript

在为网页中元素的CSS路径自动生成逻辑时，我遇到了一个问题。

用例：当用户单击网页上的任何元素时，将自动生成一个CSS选择器。

当下一页相同时，这对于刮文本非常有用，但是当元素顺序更改时会出现问题。 例如：

<html>
    ....
    <body>
          <div>ABC</div>
          <div>DEF
               <span>GHI</span>
               <ul>
                   <li>123abc</li>
                   <li>123abc</li>
                   <li>xyz</li>
               </ul>
          </div>
   </body>
</html>

假设我为包含“ xyz”的第三个li元素生成了一个CSS选择器，

正文> div：nthchild（2）> ul> li：nthchild（3）

现在，如果页面更改并且新的HTML是：

<html>
    ....
    <body>
          <div>ABC</div>
          <div>DEF
               <span>GHI</span>
               <ul>
                   <li>123abc</li>
                   <li>xyz</li>
               </ul>
          </div>
   </body>
</html>

我使用上面生成的相同选择器（body> div：nthchild（2）> ul> li：nthchild（3）），这返回我[null]。

请记住，li元素没有任何类，id，属性。 它们只是包含li标签的纯文本。

当前，我使用以下属性来生成CSS选择器：标记名，标识，类名和第n个子索引。

请帮我！

如果您要获取最后一个，可以使用：

body > div:nthchild(2) > ul > li:nth-last-child(1)

CSS选择器生成

问题描述

1楼