Using javascript, my objective is to query the URL and append parameters to all links on a page. If the link already contains a parameter, the link will append the new parameters:
User access page:https://example.com/?location=brazil
Link on page was: https://link.com/?hello=ok
Link becomes: https://link.com/?hello=ok&location=brazil
If there's no previous parameter on link, it becomes:
https://link.com/?location=brazil
I tried the following code:
var queryString = new URL(window.location).search;
document.querySelectorAll("[href]").forEach(link => {
var current = link.href;
link.href = current + queryString;
});
</script>
But when a link already contains a parameter, it uses ? instead of &
so it becomes:
https://link.com/?hello=ok?location=brazil
How do I solve this problem?
You could just check if the queryString variable contains a ? and replace it with a & instead.
So your code would be something like
var queryString = new URL(window.location).search;
document.querySelectorAll("[href]").forEach(link => {
var current = link.href;
const queryStrToUse = queryString.replace('?', '&')
link.href = current + queryStrToUse;
});
It is not a good idea to change the anchor href attribute with javascript for many reasons, but if this is a must you can do:
document.querySelectorAll("a").forEach(link => {
link.href = link.href.includes("?") ? link.href + queryString.replace("?", "&") : link.href + queryString; });
var queryString = new URL(window.location).search;
document.querySelectorAll("[href]").forEach(link => {
var current = link.href;
link.href = `${current}${current.includes('?') ? queryString.replace('?', '&') : queryString}`;
});