我在制作自动生成网页中元素的 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 选择器
body > 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 选择器:标记名、id、类名和第 n 个子索引。
请帮助我!
最佳答案
如果您想获取最后一个，可以使用:
body > div:nthchild(2) > ul > li:nth-last-child(1)
关于javascript - CSS 选择器生成，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/31465520/