jQuery clean way to get href array and rebuild it

Question

I'm still learning and although my method works, I'm not convinced it's elegant and could be improved. Basically we have a system where I CAN'T control the output so I'm using the following code to get the href of an anchor and manipulate it to point to the correct place.

HTML

<a class="shop-return" href="/_shop/category/prodect/">Link</a>

jQuery

//set url object
var link = $(".shop-return");
//get url objects href value + split it into parts
var linkUrl = link.attr("href").split("/");
    /*remove the starting blank space and the ending 
    product part of url*/
    linkUrl.splice(-2,2)
    linkUrl.shift();

//build new link
var newLinkUrl = linkUrl.join("/");
//set new link on object
link.attr('href', "/" + newLinkUrl + "/");

Any suggestions on how to make this cleaner / more efficient - and if I've gone about things in the right away or not would be appreciated.

atmd · Accepted Answer · 2015-07-21 07:20:28Z

2

An alternative is to use regular expressions to shorten the code a little:

var link =  $(".shop-return");
var linkUrl = link.attr("href").match(/\/([_a-z]+)\/([a-z]+)\//);

link.attr('href', linkUrl[0]);

This uses regEx matches. linkUrl[0] contains the url with the prefix and suffix slash '/' on, linkUrl[1] is the first url part, linkUrl[2] the second

Having brackets in the regex selects what the 'matches' are, so: link.attr("href").match(/\/([_a-z]+)\/([a-z]+)\//);

returns ["/_shop/category/", "_shop", "category"]

edited Jul 21, 2015 at 7:20

answered Jan 16, 2015 at 15:06

atmd

7,5003 gold badges35 silver badges64 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Gerico Over a year ago

Nice! So the match, can you explain what this is doing - guessing it's making an array of the URL parts?

atmd Over a year ago

Yes that's right, have added a short explanation to the answer

Collectives™ on Stack Overflow

jQuery clean way to get href array and rebuild it

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related