当前位置:首页>开发>正文

jquery怎么获取tr下的td的内容 jquery 对table的一些操作 怎么获取tr下的第二个td元素

2023-05-18 00:13:57 互联网 未知 开发

 jquery怎么获取tr下的td的内容 jquery 对table的一些操作 怎么获取tr下的第二个td元素

jquery怎么获取tr下的td的内容

// 不分行
$(table td).each(function (i, td) {
    console.log(td.innerText)
})

// 分行
$(table tr).each(function (i, tr) {
    // 这里获取tr下面的td,同理循环
})

jquery 对table的一些操作 怎么获取tr下的第二个td元素

有两种方法可以获取tr下的第二个td元素:

1、使用css选择器,$("tr td:nth-child(2)")。

2、使用遍历函数eq()。

下面就以上两个方法进行实例演示:单击按钮改变所有行的第二个单元格的样式,单击任意行改变该行第二个单元格的样式。
1、HTML结构
1123 2456 3789 4123 2、jquery代码 $(function(){ $("#btn").click(function() { $("#test tr td:nth-child(2)").addClass(red) }) $("#test tr").click(function() { $(this).children(td).eq(1).addClass(red) }) })

怎么用jquery对table里面的tr及td进行操作?


$(this).parent().sibling(":first").html()//input的父元素(td)的第一个兄弟元素
或者
$(this).parent().parent().children(":first").html()//找到tr取第一个子元素

jquery 遍历表格,需要表格中每个td的内容



$("table tr:gt(0)").each(function(i){
    alert("这是第" i "行内容")
    $(this).children("td").each(function(i){
        alert("第" i "个td的内容:" $(this).text())
    })
})

怎么用jquery获取tr下面的td

<table id="test">
            <tr>
                <td>
                    1
                </td>
                <td>
                    2
                </td>
            </tr>
            <tr>
                <td>
                    一
                </td>
                <td>
                    二
                </td>
            </tr>
        </table>

JQuery:
 $(document).ready(function () {
            $(#test tr).each(function () {                
                alert($(this).children(td).eq(1).html())
            })
        })你参考一下

最新文章