CSS 选择器

CSS 选择器是什么？

要使用自动点击、自动登录、分页模板等功能，需要指定要点击元素的 Selector 值。本说明将引导如何获取该 Selector 值。

CSS Selector（选择器）是指应用样式属性的元素。简单来说，网站基本上由无数标签组成，为了在代码上应用设计，可以说是赋予网页中存在的各个元素的特定值。在 Listly 说明中看到 CSS Selector 时，可以理解为特定选择元素（例：按钮、输入框等）具有的代码值。

使用方法

A1. 获取选择器值

1

用 PARTS 获取 CSS 选择器值

利用 Listly PARTS 可以快速简便地获取 CSS Selector 值。

Listly 图标点击 → [部分+] 选择 → 点击想要的元素

通过上述过程可以在侧边面板直接确认想要元素的 Selector 值。点击 CSS Selector（选择器）栏的 [Copy 图标] 即可轻松复制该值。

复制值后，用键盘 Ctrl+V 粘贴到需要 Selector 值的设置栏使用即可。

2

用开发者工具获取 CSS 选择器值（Legacy）

(1) 在按钮或输入框等元素上右键点击，选择 [检查]。

(2) 屏幕右侧或下方会出现代码窗口。刚才选择的元素对应的代码会以灰色显示，将鼠标移到代码上，屏幕上该区域会以颜色强调显示。

(3) 在灰色强调的代码上右键点击，选择 Copy -> Copy selector，该 selector 的值就会被复制。

(4) 前往设置窗口，在需要输入选择器值的位置用键盘 Ctrl+V 或右键后选择「粘贴」，粘贴刚才复制的值后保存。

A2. 输入了 Selector 但未正常工作时

大部分网站在输入步骤 1 获取的 Selector 值时会正常工作。 但如果输入了 Selector 值仍未出现想要的结果，请确认以下方法。

1

设计变更程序的干扰

  • 问题：由于鼠标光标设计、浏览器主题变更、设计校正用扩展程序等，可能一起复制了不必要的 CSS 代码。CSS 是与网页设计相关的代码，如果相关程序正在运行，请关闭设置后重新复制 Selector 值。

2

上层/相邻标签包含必要信息时

  • 问题：主要信息可能包含在上层标签（父元素）而非最初选择的元素。

  • 解决方法-1（使用 Parts 时）：在最初选择的元素点击向上箭头（↑），调整选择区域。扩展到不超出按钮区域的最大框，使用该值。

  • 解决方法-2（使用开发者工具时）：在开发者工具将鼠标移到代码上时，该元素区域会强调显示。这时同样选择不超过按钮区域的最大框，复制 CSS Selector 值。

上一页标签页-打开的标签页下一页表格数据

这有帮助吗？