通过 class 名称的 middle/End 获取动态元素

Question

我需要在 class 名称末尾找到一组元素，它与此高度相似 Get element by part of Name or ID 但是使用 document.querySelectorAll([class~=<constant string>]) 不起作用，但 [class=<full class name 包括随机字符（见下文）确实有效。

有问题的元素有一个 class 名称。（三个字符的随机字符串）-（一些常量字符串）是否可以通过（一些常量字符串）找到它们？

Answer 1

正确的语法是 $= 以查找以特定字符串结尾的 class。
如果您想在该选择器中使用变量，请使用 template string 插入它。

const constant = '123';
const divs = document.querySelectorAll(`[class$="${constant}"]`);
divs.forEach(div => console.log(div.textContent));

<div class="abc-123">Will be selected 1</div>
<div class="def-234">Will not be selected 1</div>
<div class="ghi-123">Will be selected 2</div>
<div class="jkl-234">Will not be selected 2</div>

通过 class 名称的 middle/End 获取动态元素

Get dynamic elements by the middle/End of it's class name

html

javascript

css

dom