JQuery将CSS应用于内部DIV

Question

我正在尝试将样式应用于父div中包含的内部div。父div还包含大量的其他div，但我只想将颜色应用于[0] div。

$("#parentDiv div")[0].css('background-color', 'red'); 

出于某种原因，它说“没有定义css功能！”

Answer 1

jQuery的方法是：

$('#parentDiv div').eq(0).css({backgroundColor: 'red'});

.eq(0)与[0]类似，但为您提供了jQuery对象。 JQuery的eq() docs解释了大部分内容（除了为什么它是“eq”而不是像“at”那样更明智的东西）。

Answer 2

$("#parentDiv div")[0] // returns a regular DOM object, NOT jquery extended

您可以尝试：

$("#parentDiv div").eq(0).css('background-color', 'red');

虽然:first选择器应该有效。

如果它仍然不起作用，请确保在方法运行后查看HTML，以确定第一个元素是否真的是您认为的。

Answer 3

这应该有效

$("#parentDiv div:first").css(background-color, 'red');

Answer 4

你不能使用“第一胎”选择器吗？

实施例：     $（“＃parentDiv div：first-child”）。css（'background-color'，'red'）;

Answer 5

有时我使用其他CSS语法会更好。你可以尝试这个（如果要添加多个样式，它也会更好）：

$('#parentDiv div:first').css({backgroundColor:'red'});

如果您需要将样式附加到除第一个之外的某个div之外，您还可以尝试使用nthChild或eq选择器（只记得nthChild是基于ONE的，而不是基于ZERO的......）：

$('#parentDiv div:nthChild(1)').css({backgroundColor:'red'});
// or
$('#parentDiv div:eq(0)').css({backgroundColor:'red'});

Answer 6

我遇到了类似的错误，并且无法弄清楚出了什么问题。它与返回DOM对象和jQuery对象的函数有关。

最后我做了类似这样的事情，但是我不确定这是最好的方法：

var divID = $("#parentDiv").children("div").attr("id");
$("#"+divID).css('background-color', 'red');