Question

我必须像这样设计样式：

<ul id="accordion">
    <li id="block.mainnavigation.cell">
        <ul style="display: block; font-weight: bold;">
            <li id="block.mainnavigation.cell">
                <a target="" href="/event/catalog:items/categoryCode/COFFEEGRND" id="block.mainnavigation.link">Ground Coffee</a>
                <ul style="display: block;">
                    <li id="block.mainnavigation.cell">
                        <a target="" href="/event/catalog:items/categoryCode/COFFEEGRNDCAFECOLL" id="block.mainnavigation.link" style="font-weight: normal;">Café Collection Coffee</a>
                    </li>
                    <li id="block.mainnavigation.cell">
                        <a target="" href="/event/catalog:items/categoryCode/COFFEEGRNDFAIRTRAD" id="block.mainnavigation.link" style="font-weight: normal;">Fair Trade Organic Coffee</a>
                    </li>
                    <li id="block.mainnavigation.cell">
                        <a target="" href="/event/catalog:items/categoryCode/COFFEEGRNDOTHER" id="block.mainnavigation.link" style="font-weight: normal;">Ground Coffee Other</a>
                    </li>
                    <li id="block.mainnavigation.cell">
                        <a target="" href="/event/catalog:items/categoryCode/COFFEEGRNDPREMCAN" id="block.mainnavigation.link" style="font-weight: normal;">Premium Coffee -Can</a>
                    </li>
                </ul>
            </li>
            <li id="block.mainnavigation.cell">
                <a target="" href="/event/catalog:items/categoryCode/COFFEEPOD" id="block.mainnavigation.link">Coffee Pods</a>
            </li>
            <li id="block.mainnavigation.cell">
                <a target="" href="/event/catalog:items/categoryCode/COFFEEWHLBN" id="block.mainnavigation.link">Whole Bean Coffee</a>
                <ul style="display: block;">
                    <li id="block.mainnavigation.cell">
                        <a target="" href="/event/catalog:items/categoryCode/COFFEEWHLBNBULK" id="block.mainnavigation.link" style="font-weight: normal;">Whole Bean Coffee Bulk</a>
                    </li>
                    <li id="block.mainnavigation.cell">
                        <a target="" href="/event/catalog:items/categoryCode/COFFEEWHLBNCAFECOLL" id="block.mainnavigation.link" style="font-weight: normal;">Café Collection Coffee</a>
                    </li>
                    <li id="block.mainnavigation.cell">
                        <a target="" href="/event/catalog:items/categoryCode/COFFEEWHLBNOTHER" id="block.mainnavigation.link" style="font-weight: normal;">Whole Bean Coffee Other</a>
                    </li>
                </ul>
            </li>
        </ul>
    </li>
</ul>

所以我尝试使用它：

$('ul#accordion ul').parent().children(":first").css('font-weight','bold')

我正在尝试获取嵌套的ul的父级并使其变为粗体，但我得到的却是li，它们包含的链接变为粗体。

出于某种原因，如果我尝试设置底部边框属性，它会按预期工作：

$('ul#accordion ul').parent().children(":first").css('border-bottom','1px solid green')

对于我在这里所缺少的任何想法将不胜感激。

Answer 1

$('ul#accordion li').each(function(index) {
    if ($(this).has('ul'))
         $(this).css('font-weight', 'bold');
});

在您提供更多信息后编辑了我的答案。

如果我做对了，你想找到包含<li>的每个<ul>粗体。因此，在我的代码段中，我会遍历<li>中的每个<ul id="accordion"></ul>元素，如果该特定<li></li>包含任何类型的<ul></ul>，则会<li></li>显得大胆。

我希望这是您所需要的，我相信您可以自己修改它以完全符合您的需求。

Answer 2

has方法非常适用于查找包含任何<li>的所有<ul>：

$('#accordion li').has('ul')
    .hide(); // Or .css or whatever

jQuery和.css（）问题

2 个答案: