У меня возникли проблемы, обертывая голову вокруг того, что должно быть простым решением. Я хочу заменить текст в теге метки, не затрагивая других "братьев и сестер", если они существуют.
Разметка образца:
<fieldset class="myFieldsetClass">
<legend>Sample Fieldset</legend>
<ol>
<li>
<label>
<span class="marker">*</span>
Some Label 1
</label>
</li>
<li>
<label>
Some Label 2
</label>
</li>
<li>
<label>
Text that doesn't match...
</label>
</li>
</ol>
</fieldset>
Цель:
- Чтобы заменить текст
Some Label X
наSome Label
(I.e. removeX
из текста метки). Теги - span внутри метки должны оставаться неповрежденными, если они существуют, например,
<span class="marker">
выше. - Я не знаю значения
X
, длина которого может быть 1 или более символов.
Текущий Script:
Мой jQuery script ниже работает, но я знаю, что он очень неэффективен. Кажется, я не могу обернуть голову вокруг этого по какой-то причине...
//for each label in the fieldset that contains text "Some Label "
$(".myFieldsetClass label:contains('Some Label ')").each(function() {
if ($(this).has("span").length > 0) {
//if the label has the span tag within, remove it and prepend it back to the replaced text
$(this).find("span").remove().prependTo($(this).text(labelText));
}
else {
//otherwise just replace the text
$(this).text('Some Label');
}
});
Сначала я подумал:
$(".myFieldsetClass label:contains('Some Label ')").text("Some Label");
Но это очищает все содержимое метки и, следовательно, удаляет диапазон, который я не хочу. Я не могу использовать любые функции замены, чтобы заменить Some Label X
на Some Label
, потому что я не знаю, что будет X
.
Может ли кто-нибудь предложить более элегантный/эффективный подход к этой проблеме?
Спасибо.
ИЗМЕНИТЬ
После нескольких ответов я думаю, что проблема в том, что даже если я выбираю нужную коллекцию, это текстовые узлы, которые jquery, похоже, не хотят изменять. Я использовал FireBug для выбора коллекции (многие ответы ниже всех выбираются правильно, но несколько по-разному). В комплекте с консолью firebug:
[<TextNode textContent="Some Label 1:">,
<TextNode textContent="Some Label 2:">,
<TextNode textContent="Some Label 3:">,
<TextNode textContent="Some Label 4:">,
<TextNode textContent="Some Label 5:">]
Проблема заключается в том, что вызов .replaceWith(),.replace(),.text() и т.д., похоже, не влияет на коллекцию jquery. Если я разрешаю вышеуказанной коллекции содержать один из пролетов, то вызов функции .replaceWith(),.replace() и т.д. Корректно действует против диапазона, но текстовые узлы остаются такими же, как и..