如何使用jQuery获取href值?

时间:2010-01-20 01:13:12

标签: javascript jquery

我正在尝试使用jQuery获取href值:

<html>
    <head>
        <title>Jquery Test</title>
         <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
        <script type="text/javascript">
        $(document).ready(function() {
            $("a").click(function(event) {
                alert("As you can see, the link no longer took you to jquery.com");
                var href = $('a').attr('href');
                alert(href);
                event.preventDefault();
            });
        });
        </script>
    </head>
    <body>
        <a href="http://jquery.com/">jQuery</a>
    </body>
</html>

但它不起作用。为什么呢?

7 个答案:

答案 0 :(得分:295)

你需要

var href = $(this).attr('href');

在jQuery单击处理程序中,this对象引用单击的元素,而在您的情况下,您总是获取页面上第一个<a>的href。顺便说一句,这就是为什么你的例子有效,但你的真实代码不是

答案 1 :(得分:10)

您可以通过以下代码获取当前的href值:

$(this).attr("href");

按ID

获取href值
$("#mylink").attr("href");

答案 2 :(得分:4)

值得一提的是

$('a').attr('href'); // gets the actual value
$('a').prop('href'); // gets the full URL always

答案 3 :(得分:2)

它的工作原理...在IE8中测试过(如果您正在测试计算机中的文件,请不要忘记允许javascript运行)和chrome。

答案 4 :(得分:2)

如果网页有一个<a>它有效,但很多<a>必须使用var href = $(this).attr('href');

答案 5 :(得分:0)

**Replacing  href attribut value to other** 
 
 <div class="cpt">
   <a href="/ref/ref/testone.html">testoneLink</a>
 </div>

  <div class="test" >
      <a href="/ref/ref/testtwo.html">testtwoLInk</a>
  </div>

 <!--Remove first default Link from href attribut -->
<script>
     Remove first default Link from href attribut
    $(".cpt a").removeAttr("href");
    
    Add  Link to same href attribut
    var testurl= $(".test").find("a").attr("href");
    $(".test a").attr('href', testurl);
</script>

答案 6 :(得分:0)

如果你的html链接是这样的:

links.filter((a) => {
            if(a.target.id == d.id) {
                links.filter((b) => {
                    if(b.target.id == a.source.id) {
                        links.filter((c) => {
                            return c.target.id == b.source.id
                        }).style("display", "block")
                    }
                    return b.target.id == a.source.id
                }).style("display", "block")
            }
            return a.target.id == d.id
        }).style("display", "block")

然后你可以在jquery中访问href,如下所示(不需要在href中使用“a”)

<a class ="linkClass" href="https://stackoverflow.com/"> Stack Overflow</a>