问题描述
|
我确定我只是缺少一些简单的东西,但我想更改所有不是'ul'直属子类的\'li \'元素的CSS背景图像,并且使用\'library_display \ '。
HTML:
<ul class=\"library_display treeview\">
<li>General Competencies
<ul>
<li>Achievement Orientation
<ul>
<li class=\"modal\" id=\"itm_59_modal\">
<a href=\"#\">Argle Bargle</a>
</li>
</ul>
</li>
<li>
<a href=\"myUrl\" class=\"modal\" id=\"itm_14_modal\">Adaptability</a>
</li>
</ul>
</li>
<li>leadership Competencies
<ul>
<li>
<a href=\"myUrl\" class=\"modal\" id=\"itm_22_modal\">Critical Judgment</a>
</li>
</ul>
</li>
<li>
<a href=\"myUrl\" class=\"modal\" id=\"itm_2_modal\">Change Management</a>
</li>
</ul>
JS:
这是正在执行的代码(在document.ready语句中):
if (!$(\'.treeview li\').parents(\'ul:first\').hasClass(\"library_display\")){
$(\'.treeview li\').css({\'background\':\'url(branch.png) 0px 0px no-repeat\'});
}
现在没有任何影响。如果删除if语句,它将对所有列表项产生影响,而不仅是我想要的。
编辑:感谢您的代码块。我遇到一些问题,无法正常工作。
解决方法
这只会影响在“ 3”内嵌套至少两个级别的“ 2”个元素
$(\".library_display li li\").css({
\'background\':\'url(branch.png) 0px 0px no-repeat\'
});
jQuery文档:http://api.jquery.com/descendant-selector/
,尝试这个:
$(\'ul.library_display\').children(\'li\').find(\'li\').css(...);
,if (!$(\'.treeview li\').parents(\'ul:first\').hasClass(\"library_display\")){
$(\'.treeview li\').css({\'background\':\'url(branch.png) 0px 0px no-repeat\'});
}
该语句对某些人是正确的,而对于其他人则是错误的,这并不使其成为有效的“ 7”语句。您可能想遍历所有ѭ8,或选择一个庞大的选择器:
$(\'.treeview li\').each(function()
{
if ($(this).parents(\'ul:first\').hasClass(\'library_display\')
{
$(this).css(\'background\',\'url(branch.png) 0px 0px no-repeat\');
}
});