Требуются: селектор jQuery с переменной частью посередине

Question

Рассмотрим следующий HTML:

<div id="Kees_1_test">test 1</div>
<div id="Kees_12_test">test 2</div>
<div id="Kees_335_test">test 3</div>

Я бы хотел селектор, который выбирает div, которые выглядят как $('div[id=Kees_{any number}_test]'). Как мне этого добиться?

^{Примечание: идентификаторы создаются Asp.Net.}

Answer 1

Попробуйте это:

$('div[id^=Kees_][id$=_test]')

Этот селектор выбирает все элементы, идентификаторы которых начинаются с Kees_ и заканчиваются _test.

Как предложил один-единственный день, вы можете использовать .filter(), чтобы средняя часть содержала только цифры. Вы можете объединить .filter() с примером выше:

$('div[id^=Kees_][id$=_test]').filter(function() {
    return /^Kees_\d+_test$/.test(this.id);
});

Это должно быть примерно так же хорошо, как и получается. Обратите внимание, что я добавил ^$ в регулярное выражение, это будет возвращать false на идентификаторах, таких как Kees_123_test_foo, но Kees_123_test проходит.

Answer 2

Лучшим решением было бы дать всем вашим div'ам класс и использовать селектор классов:

<div id="Kees_1_test" class="Kees_test">test 1</div>
<div id="Kees_12_test" class="Kees_test">test 2</div>
<div id="Kees_335_test" class="Kees_test">test 3</div>

Селектор:

$('div.Kees_test');

Если это невозможно, наиболееРазборчивым способом было бы использовать filter:

$('div[id^="Kees_"]').filter(function() {
    return /Kees_\d+_test/.test(this.id);
});

\d+ означает «выбрать одно или несколько чисел».