如何定位菜单上的所有第一个孩子
问题描述:
我只想在我的.sub-menu
类中定位所有第一个李元素并应用span元素(插入符号)。我实现了它,但不是我想要的,脱字符类出现在所有li元素上从子菜单中,我尝试了很多脚本的组合,没有任何作品。如果我使用.first()
,它只会出现在子菜单中的li元素上,而不是一个childrens。所以如果你有1个li元素放置,它将不会出现对..对不起,这个头脑风暴,我希望你能理解我。 This是亩菜单怎么看起来像右now.With验证码:如何定位菜单上的所有第一个孩子
$('.menu-new ul li:has(sub-menu)')
$('ul.sub-menu').parent('li').append('<span class=pc-caret></span');
<div class="menu-new">
<nav class="menu" role="navigation">
<ul class="menu ul">
<span class="pc-caret"></span>
<?php wp_nav_menu(array (
'theme_location'=> 'new-menu',
\t \t \t 'container' => '',
\t \t \t 'items_wrap' => '%3$s'
)); ?>
</ul>
</nav>
</div>
答
尝试......
/*
$('ul.sub-menu').each(function(i, elmt){
$('li:eq(0)', elmt).append('<span class="pc-caret">span</span>');
});
*/
//$('ul.sub-menu').eq(0).prepend('<span class="pc-caret">span</span>');
$('ul.sub-menu').each(function(i, elmt){
$(elmt).prepend('<span class="pc-caret">span</span>');
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul class="sub-menu">
<li>item 1</li>
<li>item 2</li>
<li>item 3</li>
</ul>
<ul class="sub-menu">
<li>item 11</li>
<li>item 21</li>
<li>item 31</li>
</ul>
<ul class="sub-menu">
<li>item 12</li>
</ul>
答
试试这个,你会发现你的子菜单的第一Li和检查,如果它的第一? 使用:eq(n)其中n是您的索引。索引从0开始。
//as you have more than one ul with sub-menu class this should work for you
$('ul.sub-menu').each(function(){
$(this).find('li'):eq(0).append('<span class=pc-caret></span');
});
答
您可以使用CSS进行此操作,无需使用jQuery。
ul.sub-menu li:first-child{
/* Insert your Caret Styles here, instead of the span*/
}
+0
你有试过吗? –
答
var subclass = $('.menu-new ul li').attr('class');
if(subclass=='sub-menu'){
$(".sub-menu ul li:first-child").append('<span class=pc-caret></span');
}
它的工作原理,但它在开始http://prntscr.com/d9wlxl我的插入符只显示在上面的元素,因为它是现在,并且我想删除此:http://prntscr.com/d9wmum – Dako
“上层元素”是什么意思?我认为我的示例完全按照您的描述和要求进行操作:为每个.sub菜单的每个第一个li添加一个span。如果这不是你想要更清楚地描述它。难道你不想将span扩展到每个ul.sub-menu中的第一个li,而是作为ul.sub-menu的第一个元素? – Flyer53
这就是我想要的,但看看图片,它出现在每一个李元素上。 – Dako