如何获取嵌套节点的innerHTML

时间:2013-09-01 05:13:38

标签: jquery

有人能告诉我如何获得第一个td a锚点的innerHTML吗?我似乎无法做到这一点。我正在寻找的是“测试1”和“测试2”值。

<tr>
  <td data-pid="2"><a data-pid="2" href="#"><a href="#">test 1</a></td>
  <td><a data-pid="2" class="manage-icon" href="#"><img alt="" src="delete.png"></a></td>
</tr>
<tr>
  <td data-pid="3"><a data-pid="3" href="#">test 2</a></td>
  <td><a data-pid="3" class="manage-icon" href="#"><img alt="" src="delete.png"></a></td>
</tr>

编辑: 很抱歉没有解释这个事件。我需要在我点击的行上使用innerHTML。所以,如果我点击第33行并且它的值是“test 33”,那就是我需要看到的。

我正在使用点击功能:

$(document).on("click",".manage",function(e){...

4 个答案:

答案 0 :(得分:4)

尝试此操作,假设您点击图片(如果您想在链接上触发,只需将img更改为a):

$('img').click(function () {
    console.log($(this).closest('tr').find('a').html());
});

但是您的HTML有错误(未关闭的锚点)。

<强> jsFiddle example

答案 1 :(得分:3)

我建议:

$('tr').click(function(){
    var aText = $(this).find('td:first-child a').html();
});

JS Fiddle demo

请注意,在演示中,我已经编辑了第一行元素的HTML,以匹配第二行的第一个td元素的格式(额外{{1打开标签似乎是一个错误,但如果它是故意的,那么可以修改jQuery)。

参考文献:

答案 2 :(得分:0)

要获取你提到的test1的innerHtml值,test2你可以使用.text()这样的函数

$('td a').text();

如果您想接受td的第一个孩子,那么您可以这样做:$('td:first-child a').text();

答案 3 :(得分:0)

对于我认为你的意思是text
顺便说一句你在这一行中有错误:

<td data-pid="2"><a data-pid="2" href="#"><a href="#">test 1</a></td>
                                          ^^^^^^^^^^^^ extra

并且可能会有所帮助: LIVE DEMO

$('table tr').click(function( e ){
  e.preventDefault();                 // prevent unwanted anchor click behavior
  var txt = $('td a', this).text();   // use .html() if you need to  
  alert( txt );                       // Test text value
});

如果您动态填充您的表,请选择:

$('table').on('click', 'tr', function( e ){