jquery - visibilty:hidden を持つ span 要素を無視して td から要素を抽出する方法は?

Question

サンプルコード

   <table>
        <tr class="1">
            <td>
                Top<br>
                <span style="visibility: hidden; color: red" id="span1">Ignore</span>
            </td>
            <td>
                <br>
            </td>
        </tr>
        <tr class="2">
            <td>
                Bottom<br>
                <span id="span2">Pick Me</span>
            </td>
            <td>
                <br>
            </td>
        </tr>

出力が必要

トップ ボトム ピックミー

Answer 1

このコードは私のために働いた。

var columnName =    $(this).children('td:first').contents(':not(span[style^="visibility: hidden"])').text(); 
$('#div1').text(columnName);

Answer 2

私はJQueryが苦手です...だから、Javaスクリプトの構文を教えています...JQueryで同様のロジックを試すことができます...

<script>
var text_input = "";

function getText(){
var TDs = document.getElementsByTagName("td");

for(var i=0;i

var SPANs = TDs[i].getElementsByTagName("span");
for(var j=0;j<SPANs.length;j++)
{
  var attrs = SPANs[j].attrs;
  for(var k=0;k<attrs.length;k++)
  {
     if(k[i].name != 'style' && k[i].value != 'visibility:hidden') //this  code will skip the text Ignore as it is hidden
       text_input = text_input + SPANs[j].innerText; //this code will add the text Pick Me as it is not hidden 
  }
}
}
}
</script>