如何使用Chrome控制台获取网页上的特定span标签？

Question

我在一个网站上，我想获取特定跨度的列表。

例如。名字1

如何使用 Google Chrome 控制台获取所有名称 1 的列表（每个名称位于新行）？

非常感谢您的帮助

我尝试的所有操作都返回错误消息（有些人说跨度未定义等） 我试过：

var spanElements = document.querySelectorAll('span._ap3a._aaco._aacw._aacx._aad7._aade');

    // Initialize an empty array to store the names
    var namesList = [];

    // Loop through each <span> element and add its content to the names list
    spanElements.forEach(function(span) {
        namesList.push(span.textContent);
    });

    // Log the names list
    console.log(namesList);
});

it came back "undefined"

Answer 1

假设您只需要在

<span>

元素上出现一个类名即可使其符合“名称”-span 的要求，以下应该可以满足您的要求：

const classes="_ap3a._aaco._aacw._aacx._aad7._aade".split("."),
  names=[...document.querySelectorAll('span')].filter(el=>classes.some(cl=>el.classList.contains(cl))).map(el=>el.textContent);
console.log(names);

This is <span class="_ap3a">Henry</span> and this is <span class="_aaco">Susan</span>. And then there are <span class="_aacx">Claire</span>, <span class="_aad7">Anne</span> and <span class="_aade">Tom</span>. And this is no name: <span class="noname">not-a-name</span>