javascript - 循环遍历表格的 td 并检查内部跨度上的内容，然后更改文本的颜色

Question

如何循环遍历此表并使用一类代码检查所有跨度，如果它们包含发送邀请失败，则将文本发送邀请失败着色为红色？

 <table>
 <tr height="20" class="oddListRowS1">
     <td valign="top" class="" scope="row"><span sugar="slot73b" class="code">&nbsp;<input type="checkbox" onclick="" value="28f6634e-b7bd-3654-7cc5-516bdddb573a" id="Contactscheckbox_display_id[]" class="checkbox" name="Contactscheckbox_display[]"></span></td>

     <td valign="top" class="" scope="row"><span sugar="slot74b" class="code"><a href="?action=ajaxui#ajaxUILoc=index.php%3Fmodule%3DContacts%26action%3DDetailView%26record%3D28f6634e-b7bd-3654-7cc5-516bdddb573a">Gabriel Litchfield</a></span></td>

      <td valign="top" class="" scope="row"><span sugar="slot75b" class="code"><a href="?action=ajaxui#ajaxUILoc=index.php%3Fmodule%3DAccounts%26action%3DDetailView%26record%3D95678448-0ddd-eb6e-2fc1-516bdc8f7eff">P Piper &amp; Sons</a></span></td>

      <td valign="top" class="" scope="row"><span sugar="slot76b" class="code">(166) 682-8040</span></td>

      <td valign="top" class="" scope="row"><span sugar="slot77b" class="code"><a onclick="SUGAR.quickCompose.init({&quot;fullComposeUrl&quot;:&quot;load_id=28f6634e-b7bd-3654-7cc5-516bdddb573a\u0026load_module=Delegates\u0026parent_type=Delegates\u0026parent_id=28f6634e-b7bd-3654-7cc5-516bdddb573a\u0026return_module=FP_events\u0026return_action=DetailView\u0026return_id=8dd846fd-e6d3-f6ae-a155-51b700a61700\u0026parent_name=Gabriel+Litchfield\u0026to_email_addrs=Gabriel+Litchfield+%3Chr.beans%40example.us%3E&quot;,&quot;composePackage&quot;:{&quot;load_id&quot;:&quot;28f6634e-b7bd-3654-7cc5-516bdddb573a&quot;,&quot;load_module&quot;:&quot;Delegates&quot;,&quot;parent_type&quot;:&quot;Delegates&quot;,&quot;parent_id&quot;:&quot;28f6634e-b7bd-3654-7cc5-516bdddb573a&quot;,&quot;return_module&quot;:&quot;FP_events&quot;,&quot;return_action&quot;:&quot;DetailView&quot;,&quot;return_id&quot;:&quot;8dd846fd-e6d3-f6ae-a155-51b700a61700&quot;,&quot;parent_name&quot;:&quot;Gabriel Litchfield&quot;,&quot;to_email_addrs&quot;:&quot;Gabriel Litchfield \u003Chr.beans@example.us\u003E&quot;}});" href="javascript:void(0);">hr.beans@example.us</a></span></td>

      <td valign="top" class="" scope="row"><span sugar="slot78b" class="code">Invited has been sent</span></td>

      <td valign="top" class="" scope="row"><span sugar="slot79b" class="code">No Responce</span></td>

      <td valign="top" class="inlineButtons" scope="row"><span sugar="slot80b" class="code"><ul name="" class="clickMenu subpanel records fancymenu button SugarActionMenu" id="ab583b12-7612-20a0-6ef1-51e92fffd078"><li class="sugar_action_button"><div id="ab583b12-7612-20a0-6ef1-51e92fffd078" style="display: inline"><a id="delegates_edit_9" class="listViewTdToolsS1" onfocus="javascript:subp_nav('Contacts', '28f6634e-b7bd-3654-7cc5-516bdddb573a', 'e', this, 'fp_events_contacts');" onmouseover="javascript:subp_nav('Contacts', '28f6634e-b7bd-3654-7cc5-516bdddb573a', 'e', this, 'fp_events_contacts');" href="#">edit</a></div><ul class="subnav" id=""><li><a onclick="return sp_rem_conf();" id="delegates_remove_9" class="listViewTdToolsS1" href="javascript:sub_p_rem('delegates', 'fp_events_contacts', '28f6634e-b7bd-3654-7cc5-516bdddb573a', 0);">remove</a></li></ul><span class="ab"></span></li></ul></span></td>
 </tr>
 <tr height="20" class="oddListRowS1">
     <td valign="top" class="" scope="row"><span sugar="slot73b" class="code">&nbsp;<input type="checkbox" onclick="" value="28f6634e-b7bd-3654-7cc5-516bdddb573a" id="Contactscheckbox_display_id[]" class="checkbox" name="Contactscheckbox_display[]"></span></td>

     <td valign="top" class="" scope="row"><span sugar="slot74b" class="code"><a href="?action=ajaxui#ajaxUILoc=index.php%3Fmodule%3DContacts%26action%3DDetailView%26record%3D28f6634e-b7bd-3654-7cc5-516bdddb573a">Gabriel Litchfield</a></span></td>

      <td valign="top" class="" scope="row"><span sugar="slot75b" class="code"><a href="?action=ajaxui#ajaxUILoc=index.php%3Fmodule%3DAccounts%26action%3DDetailView%26record%3D95678448-0ddd-eb6e-2fc1-516bdc8f7eff">P Piper &amp; Sons</a></span></td>

      <td valign="top" class="" scope="row"><span sugar="slot76b" class="code">(166) 682-8040</span></td>

      <td valign="top" class="" scope="row"><span sugar="slot77b" class="code"><a onclick="SUGAR.quickCompose.init({&quot;fullComposeUrl&quot;:&quot;load_id=28f6634e-b7bd-3654-7cc5-516bdddb573a\u0026load_module=Delegates\u0026parent_type=Delegates\u0026parent_id=28f6634e-b7bd-3654-7cc5-516bdddb573a\u0026return_module=FP_events\u0026return_action=DetailView\u0026return_id=8dd846fd-e6d3-f6ae-a155-51b700a61700\u0026parent_name=Gabriel+Litchfield\u0026to_email_addrs=Gabriel+Litchfield+%3Chr.beans%40example.us%3E&quot;,&quot;composePackage&quot;:{&quot;load_id&quot;:&quot;28f6634e-b7bd-3654-7cc5-516bdddb573a&quot;,&quot;load_module&quot;:&quot;Delegates&quot;,&quot;parent_type&quot;:&quot;Delegates&quot;,&quot;parent_id&quot;:&quot;28f6634e-b7bd-3654-7cc5-516bdddb573a&quot;,&quot;return_module&quot;:&quot;FP_events&quot;,&quot;return_action&quot;:&quot;DetailView&quot;,&quot;return_id&quot;:&quot;8dd846fd-e6d3-f6ae-a155-51b700a61700&quot;,&quot;parent_name&quot;:&quot;Gabriel Litchfield&quot;,&quot;to_email_addrs&quot;:&quot;Gabriel Litchfield \u003Chr.beans@example.us\u003E&quot;}});" href="javascript:void(0);">hr.beans@example.us</a></span></td>

      <td valign="top" class="" scope="row"><span sugar="slot78b" class="code">Invited has been sent</span></td>

      <td valign="top" class="" scope="row"><span sugar="slot79b" class="code">No Responce</span></td>

      <td class="" valign="top" scope="row">
          <span class="code" sugar="slot51b"> Invited has been sent</span>
      </td>

      <td valign="top" class="inlineButtons" scope="row"><span sugar="slot80b" class="code"><ul name="" class="clickMenu subpanel records fancymenu button SugarActionMenu" id="ab583b12-7612-20a0-6ef1-51e92fffd078"><li class="sugar_action_button"><div id="ab583b12-7612-20a0-6ef1-51e92fffd078" style="display: inline"><a id="delegates_edit_9" class="listViewTdToolsS1" onfocus="javascript:subp_nav('Contacts', '28f6634e-b7bd-3654-7cc5-516bdddb573a', 'e', this, 'fp_events_contacts');" onmouseover="javascript:subp_nav('Contacts', '28f6634e-b7bd-3654-7cc5-516bdddb573a', 'e', this, 'fp_events_contacts');" href="#">edit</a></div><ul class="subnav" id=""><li><a onclick="return sp_rem_conf();" id="delegates_remove_9" class="listViewTdToolsS1" href="javascript:sub_p_rem('delegates', 'fp_events_contacts', '28f6634e-b7bd-3654-7cc5-516bdddb573a', 0);">remove</a></li></ul><span class="ab"></span></li></ul></span></td>
 </tr>

Answer 1

尝试这个：

$('td span.code').each(function() {
   var span = $(this);
   if (span.text() == 'Failed to send invite') {
       span.css('color', 'red');
   } 
});

HTML

<span class="code">Failed to send invite</span>

jsFiddle

Answer 2

你可以试试这个：

$('table span.code').each( function() {
  if( /(Failed to send invite)/.test($(this).html() ) ) {
    $(this).css('color', 'red')
  }
})