jQuery的選擇DIV中的div內部形狀

Question

我有這樣的代碼：

$(document).ready(function() { 
 
    $form.find() 
 

 
});

#second { 
 
    font-size: 20px; 
 
    color: green; 
 
    background: white; 
 
    text-align: center; 
 
}

<form> 
 
    <div class="first" style="width: 301px; margin:5px 0 0 10px;"> 
 
    <div id="second" style="font-size:18px; position: absolute; top: 8px; left: 5px; width: 300px; height: 42px;">Hello</div> 
 
    </div> 
 
</form>

我要選擇div與id="second"，爲了改變background到red。有沒有解決方案使用find()來做到這一點。

對我來說最重要的是選擇div使用它的id。 jsFiddle

Answer 1

爲什麼不只是這樣做呢？

$(document).ready(function() { 
 
     $("#second").css("background-color", "red") 
 
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<form> 
 
    <div class="first" style="width: 301px; margin:5px 0 0 10px;"> 
 
    <div id="second" style="font-size:18px; position: absolute; top: 8px; left: 5px; width: 300px; height: 42px;">Hello</div> 
 
    </div> 
 
</form>

您可以通過使用#second找到元素，然後更改使用這種顏色。如果你願意，你可以將它綁定到click事件，或者任何你想改變background-color的方式。

如果你是使用find()你可以這樣做的意圖，你想找到多個元素，你可以這樣做

$(document).ready(function() { 
 
     $("form").find("#second, #fourth").css("background-color", "red"); 
 
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<form> 
 
    <div class="first"> 
 
    <div id="second">Hello</div> 
 
    <div id="third">World</div> 
 
    <div id="fourth">World</div> 
 
    </div> 
 
</form>

您可以針對許多元素你想用逗號分隔它們。

Answer 2

或者作爲形式的降序：

$(document).ready(function() { 
    $("form").find("div#second").css('background-color', 'red'); 
}); 

Answer 3

，如果你確信DIV ID的事前，很可能會使用.find（），你可以簡單地使用jQuery選擇$("#second")有點多餘。

如果你想使用.find（）雖然你只需要指定要搜索開始（的形式，你的情況），你想怎麼來過濾搜索

所以應該是：

$("form").find("#second") 

然後你可以連鎖這.css()或添加到一個變量或什麼:)

Answer 4

$(document).ready(function() { 
    $("form").find("div#second").addClass('red'); 
}); 

CSS

.red{ 
    background-color: red; 
} 

Answer 5

$(document).ready(function() { 
    $("form div").find("div").css('background-color', 'black'); 
});