如何使用包含特定字符串的 ID 访问网页上的元素答案

【问题标题】：How to access elements on a web page with IDs that contain a certain string如何使用包含特定字符串的 ID 访问网页上的元素
【发布时间】：2017-05-12 12:22:43
【问题描述】：

我是 javascript 和 Web 开发的新手，所以这是一个非常基本的问题（尽管我已经搜索过了）。我需要访问一个包含许多列的表，其中一个包含人名的行。在每一行中，包含人名的文本的 id 设置如下

<span class="PSLONGEDITBOX" id = "MTG_INSTR$2"> JOHN DOE </span> == $0

在下一行是这样的

<span class="PSLONGEDITBOX" id = "MTG_INSTR$3"> BOB DAVID </span> == $0

所以为了遍历所有包含名称的元素，我是否可以简单地遍历所有包含“MTG_INSTR”的 id？如果没有，你会怎么处理？

也不知道最后的 == $0 是做什么的

【问题讨论】：

Find all elements whose id begins with a common string的可能重复
或者更好的是Get element by part of Name or ID

标签： javascript

【解决方案1】：

尝试将document.querySelectorAll 与'span[id^="MTG_INSTR"]' 选择器一起使用：

var els = document.querySelectorAll('span[id^="MTG_INSTR"]');

console.log(els);
els.forEach(x => console.log(x.innerText));

<span class="PSLONGEDITBOX" id = "MTG_INSTR$2"> JOHN DOE </span>
<span class="PSLONGEDITBOX" id = "MTG_INSTR$3"> JOHN DOE </span>
<span class="PSLONGEDITBOX" id = "NMTG_INSTR$2"> JOHN DOE </span>

请记住，您也可以通过类选择来实现相同的结果：

var els = document.getElementsByClassName("PSLONGEDITBOX");

console.log(els);

var els = document.querySelectorAll(".PSLONGEDITBOX");

console.log(els);

<span class="PSLONGEDITBOX" id = "MTG_INSTR$2"> JOHN DOE </span>
<span class="PSLONGEDITBOX" id = "MTG_INSTR$3"> JOHN DOE </span>
<span class="PSLONGEDITBOX" id = "NMTG_INSTR$2"> JOHN DOE </span>

【讨论】：

不起作用，我认为是因为文本在表格深处？我还尝试使用 'span[id="MTG_INSTR$1"]' 仅获取一个人的姓名，但 els 似乎仍然为空（长度为 0）。我很确定 document 的值是正确的，因为如果我在控制台中对其进行评估，它会向我显示网页的 DOM（实际上昨天整个时间都在使该部分正常工作）。