Блог

Главная - Вопросы по программированию - регулярное выражение в jQuery для идентификатора

регулярное выражение в jQuery для идентификатора

#javascript #jquery #html

#javascript #jquery #HTML

Вопрос:

 <span id="aaa_1_bbb">aaa</span>
<span id="aaa_2_bbb">aaa</span>
<span id="aaa_3_bbb">aaa</span>
<span id="aaa_4_bbb">aaa</span>
<span id="aaa_5_bbb">aaa</span>
<span id="aaa_6_bbb">aaa</span>
<span id="bbb_1_bbb">aaa</span>
<span id="ccc_1_bbb">aaa</span>
<span id="ddd_1_bbb">aaa</span>
<span id="aaa_1_xxx">aaa</span>

$('span[id="aaa_*_bbb"]').css('background-color', 'red');

как я должен изменить этот jQuery? я бы хотел, чтобы добавить css (background-color: red) только для идентификатора aaa_*_bbb. * = numbers

LIVE: http://jsfiddle.net/HB3xf/2/

Комментарии:

1. Я прочитал ваш вопрос четыре раза и до сих пор не понимаю, о чем вы спрашиваете.

2. @ColinFine: aaa_22222_bbb должен быть красным

3. @Colin Ему нужен селектор CSS, который соответствует идентификатору HTML по регулярному выражению.

Ответ №1:

В нынешнем виде HTML вы можете использовать комбинацию атрибута, начинающегося с селекторов, и атрибута, заканчивающегося селекторами:

 $('span[id^="aaa_"]').filter('[id$="_bbb"]').css('background-color', 'red');

Однако, если HTML находится под вашим контролем, вам следует рассмотреть возможность добавления a class к этим элементам или id or class к их родительскому элементу, чтобы вы могли выбирать их более простым способом.

Посмотрите на это в действии.

Комментарии:

1. Первый выбор получает aaa_ *, а второй отфильтровывает те, которые заканчиваются только на bbb, поэтому получается результат aaa * _bbb @genesis

2. Мне это нравится больше, чем моя реализация filter 🙂

3. легко забыть самое простое решение

Ответ №2:

Вы могли бы использовать .filter 

 $('span').filter(function () { return /aaa_d _bbb/.test(this.id); }).css('background-color', 'red');

Ответ №3:

Вы могли бы сделать что-то вроде:

 $('span').each(function() {

    var span_id = $(this).attr('id');
    if (span_id.substring(0, 3) == "aaa" amp;amp; span_id.substring(span_id.length - 3, span_id.length) == "bbb") {
        $(this).css('background-color', 'red');
    }

});

Он принимает каждый элемент span и проверяет, являются ли первые 3 символа «aaa», а последние 3 — «bbb», и присваивает CSS, если это так.

Комментарии:

1. 1 спасибо, все в порядке, но я изменил свой пример. я нахожу другой результат.

Ответ №4:

Я думаю, вам нужно использовать это: http://james.padolsey.com/javascript/regex-selector-for-jquery /

Ответ №5:

Лучшим вариантом было бы установить определенный класс для этих элементов, например

 <span id="aaa_1_bbb" class="aaabbb">aaa</span>
<span id="aaa_2_bbb" class="aaabbb">aaa</span>
<span id="aaa_3_bbb" class="aaabbb">aaa</span>
<span id="aaa_4_bbb" class="aaabbb">aaa</span>
<span id="aaa_5_bbb" class="aaabbb">aaa</span>
<span id="aaa_6_bbb" class="aaabbb">aaa</span>
<span id="bbb_1_bbb">aaa</span>
<span id="ccc_1_bbb">aaa</span>
<span id="ddd_1_bbb">aaa</span>

Затем вы можете просто сделать $('span.aaabbb').css('background-color', 'red');

Метки: