6

本文内に次の HTML コードがあります。

<div id="hidden">

</div>

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

    </div>
</div>

次のコードを使用して子を取得しています

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

しかし、これはfirstChildDivを返したいときに「hidden」を返します。次のようなことを試しました...

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

私はそれが簡単なことだと知っていますが、どこが間違っているのかわかりません...

ありがとう

4

9 に答える 9

12

最後のセレクター

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

HTML のタイプミスを修正すると、正常に動作します (このフィドルを参照してください)。mainContianerの代わりに言いますmainContainer。

しかし、とにかく、idその要素にid?

$( '#firstChildDiv' )
于 2012-07-13T09:57:38.843 に答える
6 
$('#mainContainer > div:first-child').attr('id');
于 2012-07-13T09:54:59.853 に答える
2

これを試して、

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

「:」の前にスペースがないことを確認してください

于 2012-07-13T09:56:14.597 に答える
2

実際、あなたのhtmlにタイプミスがあります

<div id="mainContianer">

する必要があります

<div id="mainContainer">

それからあなたはすることができます

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

これは、遅くて古い jQuery 構文であるではpropなくを使用します。attr

于 2012-07-13T09:59:20.073 に答える
1

これはすべて、親の最初の子を返します-あなたの場合、親をmainContianerに置き換えます 

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


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


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


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


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

try -子セレクター (「親 > 子」)

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

も試してみてください

$("div div:first-child")
于 2012-07-13T09:55:10.710 に答える
1

これは私のために働いています....

$(document).ready(function(){
    var a =$("#mainContainer div:first-child").attr('id');
    alert(a);
});
于 2012-07-13T09:57:31.140 に答える
1 
    <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>
于 2012-07-13T09:58:18.293 に答える
0

脚本

<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>
于 2013-05-16T09:37:36.240 に答える