Замена нескольких вхождений текста с помощью jQuery в IE8

Question

У меня есть таблица, которую мне нужно изменить после того, как произошло связывание данных. Я отлично справлялся, пока мы не тестировали IE8. В этом браузере это не удалось. По сути, сторонний элемент управления будет отображать как 2 таблицы. 1-я таблица содержит заголовки для сетки (включая параметры сортировки/фильтрации/группировки), а вторая таблица содержит сами данные. У меня есть требование «изменить» заголовок, добавить строку «главный заголовок», расширить классы с помощью некоторых из наших элементов TD и элементов A. Вся функция JQuery выглядит следующим образом:

function onDataBound(e) { 
    var grid = $(this).data("tGrid"); 
    if ($(this)[0].id.indexOf("open") != -1) 
     grid = $("#open tbody")[0]; 
    else 
     grid = $("#closed tbody")[0]; 

    var tb1 = $(grid).html(); 

    if (tb1.indexOf("<tr><td") == -1 && tb1.indexOf("<TR><TD") == -1 && tb1.indexOf("<TR>\r\n<TD") == -1) { 
     // Lower case 
     tb1 = tb1.replace(/<th class=/g, "<td class="); 
     tb1 = tb1.replace(/th>/g, "td>"); 

     // Upper case 
     tb1 = tb1.replace(/<TH class=/g, "<td class="); 
     tb1 = tb1.replace(/TH>/g, "td>"); 

     $("td.t-header").each(function() { 
      var text = $(this).html(); 
      text = text.replace("t-header", "t-header rr-header rr-header-text"); 
      $(this).html(text); 
     }); 
     $("a.t-link").each(function() { 
      var text = $(this).html(); 
      text = text.replace("t-link", "t-link rr-link"); 
      $(this).html(text); 
     }); 

     //tb1 = tb1.replace(/t-header/g, "t-header rr-header rr-header-text"); 
     //tb1 = tb1.replace(/t-link/g, "t-link rr-link"); 

     tb1 = tb1.replace("Project ID", "Project<br/>ID"); 
     tb1 = tb1.replace("Risk ID", "Risk<br/>ID"); 
     tb1 = tb1.replace("Managing Department", "Managing<br/>Department"); 
     tb1 = tb1.replace("Cost Impact", "Cost<br/>Impact"); 
     tb1 = tb1.replace("Schedule Impact", "Schedule<br/>Impact"); 
     tb1 = tb1.replace("Probability of Occurance", "Probability<br/>of<br/>Occurance"); 
     tb1 = tb1.replace("Responsible Party", "Responsible<br/>Party"); 
     tb1 = tb1.replace("Due Date", "Due<br/>Date"); 
     tb1 = tb1.replace("Cost Severity", "Cost<br/>Severity"); 
     tb1 = tb1.replace("Schedule Severity", "Schedule<br/>Severity"); 

     tb1 = "<tr><td colspan='7' class='rr-header rr-risk-identification'>RISK IDENTIFICATION</td>" + 
      "<td colspan='3' class='rr-header rr-risk-assessment'>RISK ASSESSMENT</td>" + 
      "<td colspan='2' class='rr-header rr-risk-mitigation'>RISK MITIGATION</td>" + 
      "<td colspan='2' class='rr-header rr-severity-index'>SEVERITY INDEX</td></tr>" + 
      tb1; 

     $(grid).html(tb1); 
    } 
} 

Я пытаюсь получить следующий код (описания веб) для работы при запуске на IE8. Пока мне не повезло. Вот мой исходный код (фрагмент из выше), который прекрасно работает в IE9 и выше, Chrome, FireFox и т.д. - но не работает в IE8:

tb1 = tb1.replace(/t-header/g, "t-header rr-header rr-header-text"); 
tb1 = tb1.replace(/t-link/g, "t-link rr-link"); 

Я также пытался делать это (фрагмент и сверху):

$("td.t-header").each(function() { 
    var text = $(this).html(); 
    text = text.replace("t-header", "t-header rr-header rr-header-text"); 
    $(this).html(text); 
}); 
$("a.t-link").each(function() { 
    var text = $(this).html(); 
    text = text.replace("t-link", "t-link rr-link"); 
    $(this).html(text); 
}); 

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

Как вы можете видеть, первый TD заменен правильно, но все последующие сделал s 0 000 000 000 000 Использование цикла EACH просто не работает.

Любые идеи?

Answer 1

Если вы просто пытаетесь изменить список классов, можно ли просто напрямую задать имена классов изнутри каждого цикла?

$("td.t-header").each(function() { 
    this.className = "t-header rr-header rr-header-text"; 
}); 

Другое решение с использованием Jqueries переключения класса перечислены здесь:

https://stackoverflow.com/a/2576780/2511885