如何获取包含数字的名称的querySelector

ffvjumwh  于 2022-10-02  发布在  Java
关注(0)|答案(3)|浏览(91)

我有下面的URL

<h1 id="header_2" title="mytitle" data-id="header_title" class="sampleclass " xpath="1">mytitle<span aria-label="sometest"   class="sampleclass ">- Saved</span></h1>

根据id(Header_2),我想获取标题。我的id也可能包含这样的id=“Header_mdfa3fad”,但在“_”之后肯定是数字。我应该如何为它编写querySelector

hpcdzsge

hpcdzsge1#

您可以将正则表达式应用于过滤器,如下所示

var divs = [].slice.call(document.querySelectorAll("[id^='header_']")).filter(function(el){
   return el.id.match(/^header_[0-9]+/i);
});

console.log(divs);
<div id="header_1"></div>
<div id="header_2"></div>
<div id="header_3"></div>
<div id="header_abc"></div>
<div id="header_xyz"></div>
b5buobof

b5buobof2#

您可以使用此解决方案:

const headers = document.querySelectorAll("[id^='header_']");

const titles = [];

headers.forEach((header) => titles.push(header.getAttribute('title')));

// Do something you want with titles array
vhipe2zx

vhipe2zx3#

如果我理解正确的话,试着这样做:


# select h1 elements with id attribute whose value begins with "header"

headers = document.querySelectorAll("[id^='header_']");

# loop through the elements and extract the part of the attribute value following "_"

for (let header of headers) {
  target = header.getAttribute('id').split('_')[1]

  #check for the presence of a digit
  if (/d/.test(target)) {
    console.log(header.getAttribute('title'))
  }
}

相关问题