开发者

jQuery CSS Selector background

开发者 https://www.devze.com 2023-04-09 08:10 出处:网络
I\'ve to do the following simple CSS selector using jQuery , but I can\'t : \"#test > *\" I\'ve tried in many ways but I just can\'t do that!

I've to do the following simple CSS selector using jQuery , but I can't :

"#test > *"

I've tried in many ways but I just can't do that!

$("#jqt > *")

or

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

the last one seemed to work but I realize开发者_开发百科d that it shoudnt!!

How should I do this simple selection to add a very simple CSS property (background-image and font-family)????

Thanks in advance


Instead of $("#jqt > *") try $("#jqt").children()


I guess you are trying to apply css only on the "direct children" of #jqt.

Here is a trick to avoid your style from being applied to the sub child elements:

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');

If you remove not(".no_inherit"), the CSS is applied to the elements in the elements in #jqt > div, so all elements are styled.

Fiddle here : http://jsfiddle.net/7AM5Z/1/


This works, if you're wanting to select immediate children:

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

jsFiddle

0

精彩评论

暂无评论...
验证码 换一张
取 消