Question

如何使用Jquery获取div的内容。

这是我的HTML：

<div class="DataRow" data-vendorid="67">
    <div class="DataColumn" style="width: 60%;">
        Barracuda
    </div>
    <div class="DataColumn" style="width: 20%; text-align: center;">
        1
    </div>
    <div class="DataColumn" style="width: 20%; text-align: center;">
        2
    </div>
</div>

这是我的Jquery：

$(function () {
    $('.DataRow').click(function () {
        // get value: Barracuda 
    });
});

Answer 1

$(function () {
    $('.DataRow').click(function () {
        alert($(this).find(':first-child').text());
    });
});

或者：

$(function () {
    $('.DataRow').click(function () {
        alert($(this).children().first().text());
    });
});

Answer 2

如果您需要获取所点击的div的内容，它可能会对您有所帮助。

$(function () {
    $('.DataRow').click(function (event) {

        alert(event.target.innerHTML);
    });
});

DEMO 1

如果您只需要获得第一个值：

$('.DataRow').click(function () {
    var first = $(this).children().eq(0).html();
    alert(first);
});

DEMO 2

Answer 3

如果你只需要获得“Baracuda”，即第一个div文本，你可以像这样使用innerHTML：

$(function () {
    $('.DataRow').click(function () {
        // get value: Barracuda 
        alert($(this).children("div")[0].innerHTML);
    });
});

这是example。

Answer 4

你也可以使用它：

var value=$(".DataColumn").html();

Answer 5

获取第一个孩子的内容：

$('.DataRow').click(function () {
    var first = $(this).children(":first").html();
});

获取第三个孩子的内容：

$('.DataRow').click(function () {
    var third = $(this).children(":eq(2)").html();
});

如何使用jquery从div中获取值

5 个答案: