javascript - 如何获得背景颜色和颜色不同的字符串？

Question

如何获取背景颜色和颜色不同的字符串？ 预期输出 BCFE

获取输出:BCDEF

$(function(){
  //alert()
   var a =''
    $('tr td').map(function(){

      var arr = $(this).attr('style').split('#');
      arr[1] =arr[1].substring(0,arr[1].indexOf(';'))
   if(arr[1]!=arr[2]){
     a+=$(this).text();
   }
      // console.log(arr);
    })
    console.log(a)

})

HTML

<table>
    <tr>
        <td style="background-color: #0d71bb;color: #0d71bb">A</td>
        <td style="background-color: #0ea432;color: #0f0f10">B</td>
        <td style="background-color: #e0b4b4;color: #e6a200">C</td>
    </tr>
    <tr>
        <td style="background-color: #FFFF00;color: #FF0">D</td>
        <td style="background-color: #a9d5de;color: #a3c293">E</td>
        <td style="background-color: #b4d95c;color: #b21e1e">F</td>
    </tr>

</table>

这是我的代码 https://jsbin.com/vaqifujulo/edit?html,js,console

解释更多

显示可见字符串中的文本

Answer 1

您以一种相当不寻常的方式从 td 标记中获取样式。我建议你使用 jQuery 的 .css()方法来获取您想要的颜色，而不是尝试拆分 style 标记:

var bgColor = $(this).css('background-color'); // get background color td
var letterColor = $(this).css('color'); // get text color of td

另外，请注意，您不需要使用 .map()，而是可以使用 .each() 来循环 each tr td 元素。

请参阅下面的工作示例:

$(function() {
  var a = '';
  $('tr td').each(function() {
    var bgColor = $(this).css('background-color');
    var letterColor = $(this).css('color');

    if (bgColor != letterColor) {
      a += $(this).text();
    }
  })
  console.log(a);
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<table>
  <tr>
    <td style="background-color: #0d71bb;color: #0d71bb">A</td>
    <td style="background-color: #0ea432;color: #0f0f10">B</td>
    <td style="background-color: #e0b4b4;color: #e6a200">C</td>
  </tr>
  <tr>
    <td style="background-color: #FFFF00;color: #FF0">D</td>
    <td style="background-color: #a9d5de;color: #a3c293">E</td>
    <td style="background-color: #b4d95c;color: #b21e1e">F</td>
  </tr>
</table>