单击时将Query-String参数添加到静态链接

Question

我正在寻找一种健壮的方式，当访问者点击静态锚链接时，动态注入查询字符串参数。

例如，一个链接：

<a href="http://www.johndoeslink.com">Test</a>

我希望将查询字符串传递到下一页，但必须动态赋值。我如何才能做到这一点？

我知道这很简单，我只是遗漏了一些明显的东西！

提前谢谢你，

约翰·D

Answer 1

有很多方法可以做到这一点。下面我列出了两个非常简单的方法。在这里，我假设您已经有了对a元素的引用(这里我称之为element)：

修改href属性

element.href += '?query=value';

使用单击事件侦听器

element.addEventListener('click', function(event) {
    // Stop the link from redirecting
    event.preventDefault();

    // Redirect instead with JavaScript
    window.location.href = element.href + '?query=value';
}, false);

Answer 2

如果您已经知道加载页面时要追加的值，则可以在文档准备就绪时添加以下内容:如果您使用的是JQuery，请使用以下内容：

$( 'class' ).attr( 'href', function(index, value) {


return value + '?item=myValue';
});

否则(普通Javascript)：

var link = document.getElementById("mylink");
link.setAttribute('href', 'http://www.johndoeslink.com'+'?item=myValue');