Search code examples
jqueryvariableshtml-listshref

Check if every href in a list contains question mark (?) and add ampersand (&) - jquery


I have a list with hrefs. I would like to check if there is a question mark ? included in this href.
If not, add a variable with a question mark ? at the end of this href.
If it includes a question mark add a variable with ampersand & at the end of this href.

<ul>
  <li><a href="https://www.testone.com/">link 1</a></li>
  <li><a href="https://www.testtwo.com/?variable1=ok1">link 2</a></li>
  <li><a href="https://www.testthree.com/?variable2=ok2&variable3=ok3">link 3</a></li>
  <li><a href="https://www.testfour.com/">link 4</a></li>
</ul>

In above links I would like to add a variable at the end of every href so they will become like this:

https://www.testone.com/?addedVariable=add 
https://www.testtwo.com/?variable1=ok1&addedVariable=add 
https://www.testthree.com/?variable2=ok2&variable3=ok3&addedVariable=add 
https://www.testfour.com/?addedVariable=add

Solution

  • First find "href" of all links, Than find that it contains "?" or not.

    • If there is "?" in link than append "&addedVariable=add".
    • Else, append "?addedVariable=add"

    $("ul li").find("a").each(function(){
    	var link = $(this).attr("href");
      if (link.indexOf("?") !=-1) {
      	link += "&addedVariable=add ";
    	} else {
      	link += "?addedVariable=add ";
      }
      $("#newLinks").append(link + "<br/>");
    });
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <ul>
      <li><a href="https://www.testone.com/">link 1</a></li>
      <li><a href="https://www.testtwo.com/?variable1=ok1">link 2</a></li>
      <li><a href="https://www.testthree.com/?variable2=ok2&variable3=ok3">link 3</a></li>
      <li><a href="https://www.testfour.com/">link 4</a></li>
    </ul>
    
    <div id="newLinks"></div>