Question

我知道我已接近排序但我确信有更好的方法可以实现以下目标：

我想针对有孩子'ul'的'li'并添加这样的跨度：

<li class="parent">
 <a>Item 1 <span> </span></a>

  <ul>
    <li></li>
    <li></li>
  </ul>
</li>

这是我尝试使用的jQuery：

jQuery(document).ready(function(){
jQuery('ul').attr("id", "nav");
jQuery("ul#nav li:has(ul)").addClass("hasChildren");    
if (jQuery('ul#nav li.hasChildren').length)
{
    jQuery('ul#nav li.hasChildren a').append("<span></span>");
}
});

问题是跨度会被添加到所有'li'中，无论它们是否有子ul。

所以我的问题是如何只在其中包含子ul的li中添加一个span，而不是所有li的

加里

Answer 1

代码中的问题在于此选择器ul#nav li:has(ul)。它将查找li中的所有ul#nav元素。如果您只想查找子元素，那么您应该使用ul#nav > li:has(ul)。试试这个

jQuery(document).ready(function(){
   jQuery('ul:first').attr("id", "nav");
   jQuery("ul#nav > li:has(ul)").addClass("hasChildren");    
   if (jQuery('ul#nav li.hasChildren').length)
   {
       jQuery('ul#nav li.hasChildren a').append("<span></span>");
   }
});

您的代码的简化版本。

jQuery(document).ready(function(){
   jQuery('ul:first').attr("id", "nav");
   jQuery("#nav > li:has(ul) li").append("<a>...<span>..</span> </a>");
   }
});

Answer 2

ul#nav li.hasChildren a选择器正在选择所有后代a元素。如果您只想选择直接子元素，请使用ul#nav li.hasChildren > a。

Answer 3

试试这个：

$("li ul:first").before("<a>Item 1 <span> </span></a>");

它会选择每个ul中的第一个li，并在其前面添加该文字。

仅针对父母'li'并忽略其他CHildren'li''

3 个答案: