如何使用css或jquery定位optgroup的第一个孩子

有没有一种方法可以将标记为“Portfolio”的optgroup的第一个孩子显示名称“Main”？如何使用css或jquery定位optgroup的第一个孩子

我需要将它从仅显示在移动菜单中显示（它不会显示在桌面菜单中）。这是一个Wordpress小部件无法访问的WordPress主题菜单。菜单是由媒体查询触发的mobilemenu.js创建的（我猜）。它通过2个不同的名称/菜单项显示主页。我希望只针对该菜单项，并使用CSS显示：无或jQuery getElementByID解决方案，但迄今为止没有运气。在我看来，我似乎无法瞄准它。任何帮助将不胜感激！

<div class="mobilenavi"> 
 
    <select id="mm0" class="mnav" style="display: inline-block;"> 
 
    <option value="undefined">Click here:</option> 
 
    <option value="http://somedomain.com/">Home</option> 
 
    <optgroup label="Portfolios"> 
 
     <option value="#">Main</option> 
 
     <option value="http://somedomain.com/portfolio-1/">Portfolio 1</option> 
 
     <option value="http://somedomain.com/portfolios/portfolio-2/">Portfolio 2</option> 
 
     <option value="http://somedomain.com/portfolios/portfolio-3/">Portfolio 3</option> 
 
     <option value="http://somedomain.com/portfolios/beach-portfolio/">Beach Portfolio</option> 
 
     <option value="http://somedomain.com/portfolios/photos/">Photos</option> 
 
    </optgroup> 
 
    <option value="http://somedomain.com/contact/">Contact Kim</option> 
 
    </select> 
 
</div>

来源

2014-05-14 user11643

这个CSS方法将工作在一些浏览器：

Example Here

optgroup[label="Portfolios"] option:first-child { 
    display:none; 
}

由于@canon指出，display:none不会在所有的工作浏览器。

如果你想用jQuery删除它，使用：

Example Here

$('optgroup[label="Portfolios"] option:first-child').remove();

或者，如果你想要一个纯JS方法：

Example Here

var el = document.querySelector('optgroup[label="Portfolios"]'); 
el.removeChild(el.getElementsByTagName('option')[0]);

来源

2014-05-14 23:28:30

对于选择器+1 ...但'display：none'对于'

@canon感谢您指出，我没有意识到这一点:) –

Josh Crozier，谢谢你的彻底，多方法的答案。什么都没有为我工作呢。调整大小时，CSS可在桌面浏览器中运行，以触发手机尺寸的媒体查询，但不支持Android Chrome浏览器。在wp_head/wp_footer主题没有运气挂钩之前，曾尝试在页脚和标题中添加jquery/js解决方案。我认为js/jquery将在脚本中使用$（function（）{// code}）;但那里没有运气。很显然，我早在jQuery学习曲线中。我确实认为你的答案会在正常的主题下工作，并且会标记为解决方案。谢谢你的帮助。 – user11643

不$（'optgroup option：nnth-child（1）'）。hide（）;工作？

来源

2014-05-14 23:29:46 user2407400

尝试过这也没有运气，但感谢user2407400。 – user11643

如何使用css或jquery定位optgroup的第一个孩子

回答

相关问题