如何在jquery

时间:2017-09-12 08:11:36

标签: javascript jquery html

我已经在搜索它了。但这与其他问题不同。我想要的是使用<a>属性选择href标记。请参阅下面的代码:

<div class="jump-to">
   <ul>
     <li>No a</li>
     <li class="with-a">
        <a href="hello1">Has a</a>
     </li>
     <li class="with-a">
        <a href="hello8">Has a</a>
     </li>
     <li class="with-a">
        <a href="hello10">Has a</a>
     </li>
   </ul>
</div>
var current_anchor = window.location.href;
var left_anchor = $(".jump-to ul li.with-a a[href="+ current_anchor +"]").prev("li a").attr("href");

alert(left_anchor);

1 个答案:

答案 0 :(得分:3)

通过href属性进行的选择工作正常。问题是因为您的DOM遍历不正确。

prev('li a')a无效,因为li不是兄弟姐妹。您需要先使用closest('li')获取父级,然后使用prev(),然后使用find('a'),如下所示:

var current_anchor = 'http://localhost/myproject/hello8';
var left_anchor = $('.jump-to ul li.with-a a[href="' + current_anchor + '"]').closest('li').prev('li').find('a').attr('href');
console.log(left_anchor);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="jump-to">
  <ul>
    <li>No a</li>
    <li class="with-a">
      <a href="http://localhost/myproject/hello1">Has a</a>
    </li>
    <li class="with-a">
      <a href="http://localhost/myproject/hello8">Has a</a>
    </li>
    <li class="with-a">
      <a href="http://localhost/myproject/hello10">Has a</a>
    </li>
  </ul>
</div>