Question

好吧，它有点复杂我无法找到正确的方法来实现这一目标用一些例子解释它最好：我生成的导航看起来像这样：

 <ul class='cat-nav'>
     <li class="c1">
        <h1>
           <a href="catalog.php?catid=8">main category 1</a>
        </h1>
     </li>
     <li class="c2">
        <h1>
           <a href="catalog.php?catid=9">main category 2</a>
        </h1>
           <ul class='subcat-nav'>
               <li>
                  <h1>
                     <a href="catalog.php?catid=7">main cat 2 - 1st subcat</a>
                  </h1>
               </li>
               <li>
                  <h1>
                     <a href="catalog.php?catid=19">main cat 2 - 2nd subcat</a>
                  </h1>
               </li>
           </ul>
      </li>
 </ul>

现在我想做的就是去找那个有子猫的李

（意思是里面有另一个ul）并禁用其链接，以便主猫只播放标题而不是实际链接。

到目前为止，我尝试过以下方面没有成功

$(document).ready(function() {
$('ul.cat-nav li').each(function() {    
    if($(this).children('ul').length == 1) {
    $('a').replaceWith(function() { return $(this).contents(); });  
    }
});
});

这个脚本会禁用ul.cat-nav中的所有链接，这对我来说是错误的......

Answer 1

直接选择.subcat-nav，使用.siblings()定位<h1>，使用.find()定位孩子<a>，然后调用您的函数进行制作只有标题。有关更多有用功能，请参阅jQuery's DOM traversal技术的完整列表。

$(document).ready(function() {
    $('ul.cat-nav li ul.subcat-nav')
        .siblings('h1')
        .find('a')
        .replaceWith(function() { return $(this).contents(); }); 
});

Answer 2

尝试this

$(document).ready(function() {
    $('ul.subcat-nav').each(function() {  // start from subcat-nav  
        $(this).parent().find('h1:first a')
            .replaceWith(function() { // your code
                return $(this).contents();
            });

    });
});

如何获取特定的父元素取决于它的子元素，并更改其内容 - jquery？

2 个答案: