Как заменить текст диапазона с использованием имени класса внутри div

Question

Как заменить слова «воскресенье» и «понедельник» на «SUN» и «MON», используя jquery в HTML ниже.

<table> 
    <tr> 
    <th> 
     <div> 
     <div class="xyz"> 
      <a href="www.google.com"> 20 may <span>Sunday</span></a> 
     </div> 
     </div> 
    </th> 
    <th> 
     <div> 
     <div class="xyz"> 
      <a href="www.google.com"> 21 may <span>Monday</span></a> 
     </div> 
     </div> 
    </th> 
    </tr> 
</table> 

Answer 1

Вы можете использовать функцию :contains. Что он делает, он находит текст, который вы ищете, и заменяете его на целевой текст. Демо here. Единственное, что вам нужно будет выполнить отдельно для каждого слова, которое вы хотите заменить.

Html код

<div class="container"><span>Sunday</span></div> 
<div class="container"><span>Monday</span></div> 

Jquery код

$(".container span:contains('Sunday')").html('Sun');//Replace to Sun 
$(".container span:contains('Monday')").html('Mon');//Replace to Mon 

Answer 2

Попробуйте что-то вроде this jsfiddle. Вот код, который делает фактическую работу:

$(".xyz").each(function() { 
    var theSpan = $(this).find("span").first(); 

    switch (theSpan.text()) { 
     case "Sunday": 
      theSpan.text("SUN"); 
      break; 
     case "Monday": 
      theSpan.text("MON"); 
      break; 
     // include additional case statements 
    } 
}); 

Имейте в виду, что именно этот метод работает только для точного расположения, что у вас есть, потому что он использует find вызов, а затем использует first, чтобы получить только один span тег в структура оригинала div.

Если вы должны были предоставить класс в span, который содержит заменяемый текст, вы получите более согласованные результаты и, возможно, не нуждаетесь в вызове find.

---

В качестве варианта этого, вы могли бы использовать некоторые строки манипуляции, если то, что вы действительно ищете это «все прописные аббревиатура полного названия каждого дня.» Вместо большого switch заявления, вы могли бы сделать то же самое с этим кодом (also available in this jsfiddle):

$(".xyz").each(function() { 
    var theSpan = $(this).find("span").first(); 
    theSpan.text(theSpan.text().substr(0,3).toUpperCase()); 
}); 

Answer 3

$(function(){ 
     $(".xyz").each(function(){ 
     var obj=$(this).text($(this).text(); 
      obj.replace('Sunday','Sun')); 
     obj.replace('Monday','Mon')); 
     }); 
    }); 

Did you mean this? 

Answer 4

Попробуйте один

$(".xyz span:contains('Sunday')").text('Sun'); 
$(".xyz span:contains('Monday')").text('Mon');