js和jquery怎么获取点击链接的url？

✓ 已被采纳

分析一下这个问题
点击一个超链接，怎么获取到它的url呢

首先，需要获取信息，应当先保证其不跳转，即点击a标签时如何阻止其自动跳转到href的动作
获取url，即获取href属性的值

上面诸位同志回答2部分的都很好，但是都没处理自动跳转的问题

HTML

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>文档标题</title>
</head>
<body>
    <!-- some other code -->
    <a id='showHref' href="http://www.baidu.com">baidu</a>
</body>
</html>

假设是阻止特定标签的跳转，就不进行全体a标签的遍历了

JS

    <script type="text/javascript">
        function init() {
            document.getElementById('showHref').onclick = function() {
                console.log(this.href);
                /*下面两种写法任选其一*/
                // return false;
                event.preventDefault();
            };
        }
    </script>

Jquery

    <script type="text/javascript">
        $(document).on('click','#showHref',function() {
            console.log(this.href);
            /*或者*/
            // console.log($('#showHref').attr('href'));
            /*下面两种写法任选其一*/
            // return false;
            event.preventDefault();
        });
    </script>

全体a标签的遍历

@ 莲_涳栢__ 写的很好了，我这里再整合一下jquery的写法

JS

    <script type="text/javascript">
        function init() {
            Array.prototype.forEach.call(document.getElementsByTagName('a'), function(dom) {
                dom.onclick = function() {
                    console.log(this.href);
                    /*下面两种写法任选其一*/
                    // return false;
                    event.preventDefault();
                };
            });
        }
    </script>

Jquery

    <script type="text/javascript">
        $(document).on('click','a',function() {
            console.log(this.href);
            /*或者*/
            // console.log($('#showHref').attr('href'));
            /*下面两种写法任选其一*/
            // return false;
            event.preventDefault();
        });
    </script>

补充

document.querySelectorAll()比getElement(s)系列有更好的兼容性，而且写法更统一，建议使用。当然IE6那种古董好像也是无法兼容的┑(￣Д ￣)┍

莲_涳栢__

6871820

发布于
2017-03-08

[].forEach.call(document.querySelectorAll('a'),function(o){
o.onclick = function(){
var s = this.href;
console.log(s);
return !1;
};
});

whhlu

47051525

发布于
2017-03-08

获取属性啊，用attr

William

1284

发布于
2017-03-08

$(document).on('click','a',function(){console.log($(this).attr('href'))})

iexn

27219

发布于
2017-03-08

js

var link = document.getElementById('linkId');  // 针对你点击的链接进行修改

link.href; // 或

link.getAttribute('href');

jquery

$('#linkId').attr('href')

js和jquery怎么获取点击链接的url？

HTML

JS

Jquery

全体a标签的遍历

JS

Jquery

补充

js

jquery

你尚未登录，登录后可以

扁平化数组转换成树形?

js 如何将Key属性相同的放在同一个数组？

省市区街道数据在哪里可以下载？

两个promise问题？

Object assgin拷贝问题？

Vue项目一个报错无法找到原因?

前端页面脚本更新时，如何让用户端，使用最新脚本？