Question

我要使用jQuery做以下简单的CSS选择器，但我不能：

"#test > *"

我在很多方面尝试过，但我不能这样做！

$("#jqt > *")

或

$('*',$("#jqt")).css()

最后一个似乎有效，但我意识到这很糟糕!!

我应该如何做这个简单的选择来添加一个非常简单的CSS属性（background-image和font-family）????

提前致谢

Answer 1

而不是$("#jqt > *")尝试$("#jqt").children()

Answer 2

如果你想选择直接的孩子，这是有效的：

$("#jqt > *").css({ 'background-image' : 'url(...)', 'font-family' : 'arial'})

jsFiddle

Answer 3

我猜你只想在#jqt的“直接孩子”上申请css。

这是避免将您的样式应用于子子元素的技巧：

<强> HTML：

<div id="jqt">
    <a>link</a>
    <p>paragraph</p>
    <div>div</div>
    <div class="no_inherit">
        <a>sub link</a>
        <p>sub paragraph</p>
        <div>sub div</div>
    </div>
</div>

<强> CSS：

.mystyle {
    background-image: url(img.png);
    font-family: "courier";
}

<强> jQuery的：

$('#jqt').children().not(".no_inherit").addClass('mystyle');

如果您删除not(".no_inherit")，则CSS会应用于#jqt > div中元素中的元素，因此所有元素都会设置样式。

在这里小提琴：http://jsfiddle.net/7AM5Z/1/

jQuery CSS选择器背景

3 个答案: