Подстановочное решение на основе атрибута id элемента
Да, это возможно. Это отвечает на ваш вопрос напрямую, не полагаясь на сторонние JavaScript или API или атрибуты, отличные от идентификатора элемента. Также вам не нужно использовать class =
Пример вызова пользовательского метода
// Uses JavaScript regex features to search on id= attribute
var arrMatches = document.getElementsByRegex('^statusMessage_.*');
Получает массив, содержащий все элементы, имеющие идентификатор, начинающийся с «statusMessage_» (даже вложенные).
Пример реализации - многоразовый и универсальный
Вот реализация функции getElementsByRegex, которая ищет в DOM заданное регулярное выражение, начиная с document. Он прикреплен к объекту документа для удобства и в соответствии с ожидаемым поведением.
<head>
<script>
// Called as: document.getElementsByRegex("pattern").
// Returns an array of all elements matching a given regular expression on id.
// 'pattern' argument is a regular expression string.
//
document['getElementsByRegex'] = function(pattern){
var arrElements = []; // to accumulate matching elements
var re = new RegExp(pattern); // the regex to match with
function findRecursively(aNode) { // recursive function to traverse DOM
if (!aNode)
return;
if (aNode.id !== undefined && aNode.id.search(re) != -1)
arrElements.push(aNode); // FOUND ONE!
for (var idx in aNode.childNodes) // search children...
findRecursively(aNode.childNodes[idx]);
};
findRecursively(document); // initiate recursive matching
return arrElements; // return matching elements
};
</script>
</head>
Вероятно, есть более эффективные реализации, но эта обеспечивает начало. Тело функции можно заменить другими алгоритмами по вкусу.
Проверка кода
Наконец, протестируйте его, используя рекламный ролик HTML с вложенными элементами, подобными этому
<body>
<div id="statusMessage_1">1</div>
<div id="statusMessage_2">2
<div id="content">other stuff</div>
<div id="statusMessage_3">3</div>
</div>
<script>
// a quick test to see if you get the expected result.
var arrMatches = document.getElementsByRegex('^statusMessage_.*');
alert('found ' + arrMatches.length + ' matches - expected 3.')
</script>
Этот блок HTML содержит три элемента, начиная с id="statusMessage_; поэтому в тесте оповещения будет указано
"найдено 3 совпадений - ожидается 3"
Дополнительная информация о вариациях
Если вы хотите ограничить поиск только элементами div или каким-либо другим типом определенного элемента, то вам нужно будет внедрить следующий код getElementByTagName в алгоритм, чтобы ограничить набор элементов, для которых выполняется поиск.
var arrDivs = document.getElementsByTagName("div"); // pull all divs from the doc
Возможно, вы захотите изменить общий алгоритм, передав имя тега во втором аргументе для фильтрации, прежде чем поиск начнется следующим образом
var arrMatches = document.getElementsByRegex('^statusMessage_.*', 'div');