Question

我有一个表格html代码，来源于ajax，如下所示：

<table class="stripped">
    <tr class="red">
        <td style="font-weight:bold;">City</td>
        <td class="red">xyz</td>
    </tr>
    <tr class="red">
        <td style="font-weight:bold;">Country</td>
        <td class="red">abc</td>
    </tr>
    <tr class="red">
        <td style="font-weight:bold;">Date</td>
        <td class="red">05.10.2017</td>
    </tr>
</table>

<table class="stripped">
    <tr class="red">
        <td style="font-weight:bold;">Category</td>
        <td class="red">This is category</td>
    </tr>
</table>

我希望在此html中获得country值的值。 Jquery nth-child可以找到，但我找不到。我找到nht tr项但无法找到国家/地区的值（＆＃34; abc＆＃34;）。

Answer 1

不确定您要对其执行什么操作，但如果您想获得包含td的{{1}}的第二个tr，请使用以下Country < / p>

<强>演示

＆＃13;

$("table tr:contains(Country) td:eq(1)").text()

＆＃13;

var text = $("table tr:contains(Country) td:eq(1)").text();
console.log(text)

＆＃13;

Answer 2

 let country = document.querySelectorAll("tr")[1].querySelectorAll("td")[1].innerText;

 document.querySelectorAll("tr")[1] (second tr)
 .querySelectorAll("td")[1] (second td in second tr)
 .innerText (gets value)

Answer 3

关注选择器如何：

e.preventDefault();

Answer 4

除nth-child之外唯一真正的参考点是您的文字标题。

由于这种情况，我们可以查看表格单元格中的标题 Date ，然后从下一个单元格（该单元格的索引+ 1）中获取文本。

应该指出，这不太理想。这个解决方案，就像我们可以根据具体情况提供的其他解决方案一样，如果将来标记发生变化，很容易被打败。只是记住一些事情，虽然我知道有时你别无选择。

$("td").each(function(ind, ele) {
if(ele.textContent === "Date"){
console.log("date is", $("td").eq(ind+1).text() );
}});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table class="stripped">
    <tr class="red">
        <td style="font-weight:bold;">City</td>
        <td class="red">xyz</td>
    </tr>
    <tr class="red">
        <td style="font-weight:bold;">Country</td>
        <td class="red">abc</td>
    </tr>
    <tr class="red">
        <td style="font-weight:bold;">Date</td>
        <td class="red">05.10.2017</td>
    </tr>
</table>

<table class="stripped">
    <tr class="red">
        <td style="font-weight:bold;">Category</td>
        <td class="red">This is category</td>
    </tr>
</table>

Answer 5

代码：http://tpcg.io/Vy9IwJ

<script>
$(document).ready(function() {
    $(".stripped td").get().forEach(function(entry, index, array) {
        if ($(entry).text()=='Country') {
            $('#result').html( $('#result').html()+'Country: '+$(entry).next().text() );
        }
    });
});
</script>
<div id="result">
</div> 
<table class="stripped">
    <tr class="red">
        <td style="font-weight:bold;">City</td>
        <td class="red">xyz</td>
    </tr>
    <tr class="red">
        <td style="font-weight:bold;">Country</td>
        <td class="red">abc</td>
    </tr>
    <tr class="red">
        <td style="font-weight:bold;">Date</td>
        <td class="red">05.10.2017</td>
    </tr>
</table>
<table class="stripped">
    <tr class="red">
        <td style="font-weight:bold;">Category</td>
        <td class="red">This is category</td>
    </tr>
</table>

如何使用jquery在表格单元格值中查找查找值

5 个答案: