Блог

У меня есть список с несколькими элементами, которые содержат некоторый повторяющийся текст, который я хочу удалить или скрыть. Итак, из этого:

 <ul class="juicy">
<li>Juicy Green Apples</li>
<li>Juicy Green Tomatoes</li>
<li>Juicy Green Broccoli</li>
</ul>
  

Я хотел бы добиться этого:

 <ul class="juicy">
<li>Apples</li>
<li>Tomatoes</li>
<li>Broccoli</li>
</ul>
  

.text() Метод jQuery может справиться с этим довольно легко, если текст, который вы заменяете, известен заранее.

 var textToReplace = "Juicy Green",
    re = new RegExp(textToReplace,"i");
$(".juicy li").text(function(index,text){
  return text.replace(re,'');
});
  

Редактировать: ответ на вопрос в комментарии:

Что-то вроде этого:

 var textToReplaceArr = ["Juicy Green","Sour Yellow"];
for (var i = 0; i < textToReplaceArr.length; i  ) {
  $(".juicy li").text(function(index,text){
    var re = new RegExp(textToReplaceArr[i],"i");
    return text.replace(re,'');
  });
}
  

Вы хотите попробовать что-то динамическое?

 $(document).ready(

function() {
    var repeatedWordsArray = new Array();
    var wordsToRemoveArray = new Array();
    var i = 0;
    $($("ul.juicy > li").map(function() {
        return $(this).text();
    }).get().join(" ").split(/s /g)).each(   //Joins the text of all elements, appends space between them and then splits with space character

    function() {
        repeatedWordsArray[this] = repeatedWordsArray[this] == undefined ? 1 : repeatedWordsArray[this]   1;      //Increments the counter when the same word is encountered
        if (repeatedWordsArray[this] == 2) {     //If found twice, make a note of the word
            wordsToRemoveArray[i  ] = this;
        }
    });
    if (wordsToRemoveArray.length > 0) {
        $("ul.juicy > li").each(
        function() {
            var ulElement = this;
            $(wordsToRemoveArray).each(
                function() {
                    var regexp = new RegExp('^\s*\w \s*$');
                    if(!$(ulElement).text().match(regexp)) {     //Do not match if the text of element contains a single word with or without spaces at its ends
                        regexp = new RegExp('\s*'   this   '\s*','g');
                        $(ulElement).text($(ulElement).text().replace(regexp, ''));   //Set the text of the element after removing the repeatedly found word
                    }
                }
                );
            }
        );
    }
}
);
  

Это работает и для следующего ul:

 <ul class="juicy">
    <li>Juicy Green Apples</li>
    <li>Juicy Green Tomatoes</li>
    <li>Juicy Green Broccoli</li>
    <li>Juicy</li>
    <li>      Green  </li>
 </ul>