我身体内的以下HTML代码：

<div id="hidden">

</div>

<div id="mainContianer">
    <div id="firstChildDiv">

    </div>
</div>

我使用下面的代码来获取子

$("div:first-child").attr('id')

但是，当我想它返回firstChildDiv这将返回“潜伏”，我曾尝试喜欢的东西......

$("div[mainContainer ] div:first-child").attr('id') 
$("div[id=mainContainer ] :first-child").attr('id') 
$("#mainContainer :first-child").attr('id')

我知道它的一个简单的事情，但不能似乎看到我错了......

谢谢

Answer 1:

你的最后选择

$("#mainContainer :first-child").attr('id')

工作得很好，如果你纠正HTML错字（见本小提琴）。它说mainContianer代替mainContainer 。

但是，不管怎样，你为什么不通过选择简单的id ，如果该元素有一个id ？

$( '#firstChildDiv' )

Answer 2:

$('#mainContainer > div:first-child').attr('id');

Answer 3:

尝试这个，

$("#mainContianer:first-child").attr("id")

检查之前没有空间“：”

Answer 4:

其实，你有一个错字出现在你的HTML

<div id="mainContianer">

应该

<div id="mainContainer">

然后，你可以做

$("#mainContainer div:first-child").prop('id')

这里使用prop ，而不是attr ，这是比较慢，老的jQuery语法

Answer 5:

这是为我工作....

$(document).ready(function(){
    var a =$("#mainContainer div:first-child").attr('id');
    alert(a);
});

Answer 6:

这一切都回到你parent--的第一个孩子在你的情况下，通过更换mainContianer父

$('#parent').children(":first") 


$('#parent').children(":first-child") 


$( $('#parent').children()[0] ) 


$('#parent').find(":first") 


$('#parent').find(":nth-child(1)")

尝试- 子选择器（“父>子”）

$("div > div").attr('id')

也尝试

$("div div:first-child")

Answer 7:

    <html>
        <head>
            <script>
                function getDiv(){
                alert("answer = "+$('#mainContianer div:first-child').attr('id'));

                }
            </script>
        </head>
        <body>

            <div id="hidden"></div>

                 <div id="mainContianer">
                    <div id="firstChildDiv">
                    </div>
                 </div>

                <button onclick="getDiv()">click</button>
    </body>
<html>

Answer 8:

脚本

<script language="JavaScript">
    jQuery(document).ready(function($) { 
    $("#MY_BUTTON").click(function(event) {
                 $("div#PARENT_DIV").find("#CHILD_DIV").hide();
             });    
});
</script>

HTML代码

<div id="PARENT_DIV">
        <h1 class="Heading">MY HTML PAGE TEST</h1>
        <br />
        <div id="CHILD_DIV">THIS IS MY CHILD DIV</div>
 </div>

    <div class="MY_BUTTONS"> 
        <a class="MySubmitButton" id="MY_BUTTON">
            <span>Test it!</span>
        </a>
     </div>

文章来源: Jquery Get Child DIV Within DIV