Question

在一个页面上，我有一个包含多行（大多数为100行）的表，每个行都有多列。每一行都有一个类<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <select> <option>Test</option> <option>Test 2</option> <option>Test 3</option> </select>的锚。

我正在使用chrome dev工具控制台来使用

获取此锚元素

.no-red

这会返回一个数组

document.querySelectorAll('.no-red')

我想在此列表中循环并提取每个锚元素的文本。

这是一个锚元素的样本

NodeList(100) [a.no-red.selectorgadget_selected, 
a.no-red.selectorgadget_suggested, a.no-red.selectorgadget_suggested, 
a.no-red.selectorgadget_suggested, a.no-red.selectorgadget_suggested, 
a.no-red.selectorgadget_suggested, a.no-red.selectorgadget_suggested, 
a.no-red.selectorgadget_suggested, a.no-red.selectorgadget_suggested, 
a.no-red.selectorgadget_suggested, a.no-red.selectorgadget_suggested
....and so on]

如何获取所有100个锚元素的文本？

Answer 1

以wOxxOm的答案为基础。

选择CSS类名称为“ no-red”的元素的文本内容（HTML标记之间的文本）

<a class="no-red">My Text</a>

首先，通过单击带有Chrome中圆点的右侧菜单打开Chrome开发人员工具，然后依次单击“更多工具”和“开发人员工具”，或使用组合键Ctrl + Shift + I

下一步，点击控制台标签

在闪烁的光标处输入

$$('.no-red').map(e => e.textContent)

这将提取“ no-red”类的相应元素的文本内容。但这不会使您可以执行其他任何操作。

如果尝试此操作以提取文本，然后将其复制并粘贴到其他应用程序或代码中，则可以在光标处键入以下内容以选择所需的文本，然后将其复制到剪贴板中。可以更改为您选择的程序/软件，然后使用“编辑”>“粘贴”菜单项或Ctrl + V组合键从剪贴板粘贴

copy($$('.no-red').map(e => e.textContent).join('\n'))

Chrome DevTools：循环通过NodeList

1 个答案: