如何使用javascript将参数及其值设置为HREF动态

Question

我有如下链接

<a id="dynamicLink" href="http://www.w3schools.com?userName=test">Visit W3Schools</a>

我想将userName的值从test更改为test1。

如何使用javascript做到这一点？

有人可以帮我吗？

Answer 1

我建议使用库来处理URI。它将提供一些一致性。以下是使用URI.js的示例：

// Get our <a> element
var l = document.getElementById('dynamicLink');

// Use URI.js to work with the URI
// http://medialize.github.io/URI.js/
var uri = URI(l.href);

// Get the query string as an object
var qs = uri.query(true);

// Change our value
qs.userName = 'test1'

// Update the URI object
uri.query(qs);

// Set our new HREF on the <a> element
l.href = uri;

<script src="https://cdnjs.cloudflare.com/ajax/libs/URI.js/1.15.2/URI.min.js"></script>

<a id="dynamicLink" href="http://www.w3schools.com?userName=test&someOtherKey=val">Visit W3Schools</a>

Answer 2

试试这个：

document.getElementById("dynamicLink").href.replace("userName", "test1");

这应该将 href 中 userName 的值更改为 test1