在javascript中将动态网址设置为href

Question

我想设置动态链接到href链接。我真正需要做的是调用一个js方法，它根据一个href内的域返回url。

 <a href="javascript:getAuthUrl()"><u>Login&gt;&gt;</u></a>

 function getAuthUrl() {
       ...
            if (domain.includes("localhost")) {
                return buildOAuthUrl(hostConfig.dev);
            }
            else if (domain.includes("...")) {
                return buildOAuthUrl(hostConfig.test);
            }
            else if (domain.includes("....")) {
                return buildOAuthUrl(hostConfig.uat);
            }
            else if (domain.includes("....")) {
                return buildOAuthUrl(hostConfig.prod);
            }
            else if (domain.includes("....")) {
                return buildOAuthUrl(hostConfig.test);
            }
            else {
                return buildOAuthUrl(hostConfig.dev);
            }
        }
    }

我在stackoverflow中尝试了一些例子，但这并没有解决我的错误/问题。

Answer 1

虽然'CertainPerformance'已经很好地回答了它。添加另一个版本，你想让它与问题一致。

您可以直接在onClick事件上使用锚点标记进行DOM操作。

例：

function getAuthUrl() {
    url="";
    if (domain.includes("localhost")) {
        url=buildOAuthUrl("dev");
    }
    else if (domain.includes("...")) {
        url=buildOAuthUrl("test");
    }
    else if (domain.includes("....")) {
        url=buildOAuthUrl("uat");
    }
    var b = document.querySelector("#url");
    b.setAttribute("href", url);    
}

<a id="url" href="" onclick="getAuthUrl()"><u>Login&gt;&gt;</u></a>

Answer 2

尝试添加事件侦听器而不是使用内联eval：

document.querySelector('a').addEventListener('click', (e) => {
  if (Math.random() < 0.5) e.target.href = 'https://stackoverflow.com/questions/49605314/set-dynamic-url-to-a-href-in-javascript/49605338';
  else e.target.href = 'https://stackoverflow.com';
});

<a>go somewhere</a>

（如果你想保留普通的链接点击处理，请确保不要使用e.preventDefault()）