Question

请告诉我我如何在父母李中插入第一个孩子的链接。

   <li class="parent">
            <a href="#">About</a>
                                <ul>
                   <li class="child">
                        <a href="About.html" title="About">About</a>


                    </li>
                                                                    <li class="child">
                        <a href="service.html" title="Staff">Service</a>


                    </li>
                                                                    <li class="child">
                        <a href="contact.html" title="Testimonials">Contact</a>


                    </li>

在脚本之后，我想得到那个结果

   <li class="parent">
            <a href="About.html">About</a>
                                <ul>
                   <li class="child">
                        <a href="About.html" title="About">About</a>


                    </li>
                                                                    <li 
      class="child">
                        <a href="service.html" title="Staff">Service</a>


                    </li>
             <li class="child">
           <a href="contact.html" title="Testimonials">Contact</a>


                    </li>

**请告诉我，我如何在父母李中插入第一个孩子的链接。请检查并告诉我该怎么做

Answer 1

您可以使用attr获取/设置属性，并使用$(selector).find()执行dom元素查询。

$(document).ready(function() {
  $('.parent').each(function() {
    if($(this).find('>a').attr('href') === '#') { //requested added cond.
       $(this).find('>a').attr('href', $(this).find('>ul>li:first>a').attr('href'));
    }    
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<li class="parent">
  <a href="#">About</a>
  <ul>
    <li class="child">
    <a href="About.html" title="About">About</a>
    </li>
    <li class="child">
    <a href="service.html" title="Staff">Service</a>
    </li>
    <li class="child">
    <a href="contact.html" title="Testimonials">Contact</a>
    </li>
  </ul>
</li>
<li class="parent">
  <a href="nochange.html">Service</a>
  <ul>
    <li class="child">
    <a href="service.html" title="Staff">Service</a>
    </li>
    <li class="child">
    <a href="About.html" title="About">About</a>
    </li>
    <li class="child">
    <a href="contact.html" title="Testimonials">Contact</a>
    </li>
  </ul>
</li>

Answer 2

// finds all a with href="#" in .parent
$('.parent > a[href="#"]').each(function(){
  // for each sets href
  $(this).attr('href',
    // gets a`s siblings "ul"s and finds first a in li
    $(this).siblings('ul').find('li > a:first').attr('href')
  )
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<li class="parent">
  <a href="#">About</a>
	<ul>
		<li class="child">
			<a href="About.html" title="About">About</a>
		</li>
		<li class="child">
			<a href="service.html" title="Staff">Service</a>
		</li>
		<li class="child">
			<a href="contact.html" title="Testimonials">Contact</a>
		</li>
	</ul>
</li>

当父链接为（＃）时如何从第一个孩子插入第一个孩子的链接

2 个答案: