Question

我有下面的HTML并且我试图获取该按钮（btnClick）上特定Div的文本（主文本和ChildText）（Div的数量可能在运行时有所不同）

<div class="main">
*** Some Main Text ***  <button class="btnClick" type="button"> </button>
<div class="child">
<p> ** Some child Text ** </p>
</div>
</div>
<div class="main">
*** Some Main Text ***  <button class="btnClick" type="button"> </button>
<div class="child">
<p> ** Some child Text ** </p>
</div>
</div>

我试过了，但我不确定如何使用类名称的唯一ID字段来做这个，并且认为应该有办法。

谢谢

Answer 1

$('.btnClick').click(function () {
    var mainText = '', childText;

    $(this).parent().contents().filter(function () {
        return this.nodeType == 3;
    }).each(function (i, el) {
        mainText += $(el).text();
    });

    childText = $(this).siblings('.child').text();

    alert(mainText);
    alert(childText);
});

请参阅jsFiddle。

Answer 2

试试这样：

$('.btnClick').click(function(){
        console.log($(this).parent().text().split('\n')[1] + $(this).siblings('.child').text());
});

Demo

Answer 3

你可以这样做：

$('.btnClick').click(function () {

    var mainText = $.trim($(this).closest('.main').text().split('\n')[0]);
    console.log('Main Text : ', mainText);

    var childText = $.trim($(this).next('.child').text());    
    console.log('Child Text : ', childText);
});

FIDDLE DEMO

Answer 4

您可以使用$(this).parent('div.main').text()获取div.main中包含的所有文本（这将包括所有后代元素的文本）。

如果您想单独获取div.main的文字，可以执行以下操作：

var mainText = $(this).parent('div.main').get(0).childNodes[0].nodeValue;

..和儿童文本：

var childText = $(this).next('div.child').text();

使用Jquery在按钮上单击遍历div

4 个答案:

Demo

Here's a fiddle