jquery - 如何从 td 中提取元素，忽略具有可见性的 span 元素：隐藏？

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 str = "";
$("table tr td").each(function(){
var bar = $(this);
bar.find("[style^='visibility: hidden']").remove();
str += bar.text();
});
alert(str);

看演示

Answer 2

像这样试试

$(document).ready(function(){
    var my_string;
    $('tr td').each(function(){
          my_string += $(this).html();    
    });
    alert(my_string);
});

如果您只需要文字的地方

my_string += $(this).text();

Answer 3

这段代码对我有用。

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

Answer 4

我不擅长 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>