Jay Dilla
Jay Dilla

Reputation: 33

Trim partial link in jQuery

I am trying to remove the start of a link in jQuery. I have tried to inject the following function but it doesn't work. What am I doing wrong?

JS

$(function() {
  $('link-active').each(function() {
     $(this).attr('href').remove('http://www.linkplus.com/xQWE=');
     });
});

HTML

<td class="block">
<a class="link-active" 
href="http://www.linkplus.com/xQWE=http://www.example.com">Get</a>
</td>

Upvotes: 1

Views: 346

Answers (7)

KL_
KL_

Reputation: 1513

When you're trying to search for classes, make use of dot (.), $('link-active') should be $('.link-active').
About .remove(): this one will remove one element of the DOM; not applicable in this case.

Solution: You will need to use .attr() to return AND update the href attribute of your tag, .replace() method should help.

$(function() {
  $('.link-active').each(function() {
    let href = $(this).attr('href'); //returns href value
    let removableUrl = 'http://www.linkplus.com/xQWE=';
    href = href.replace(removableUrl, ''); //replace the url you don't want with ''
    $(this).attr('href', href); //update href value
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<td class="block">
<a class="link-active" 
href="http://www.linkplus.com/xQWE=http://www.example.com">Get</a>
</td>

Note: There's other methods to separate the url you don't want (if the url stay in the same format), check for:
.substring(): href = href.substring(removableUrl.length);
.split(): href = href.split('=')[1];
.replace() with regex: href = href.replace(/.*\=/,'');

Upvotes: 1

MikeVelazco
MikeVelazco

Reputation: 905

You have to get the string, replace it and then set it again.

Something like this:

$(function() {
    $('link-active').each(function() {
    replacement = 'http://www.linkplus.com/xQWE=';
    url = $(this).attr('href');
    $(this).attr('href', url.replace(replacement, ''));
    });
});

Upvotes: 0

Christian Santos
Christian Santos

Reputation: 5456

remove is not being used correctly here, as that method is meant to remove elements from the DOM and accepts a selector string as its argument.

Try something like this instead:

$(function() {
  $('.link-active').each(function() {
     var href = $(this).attr('href');
     var strToReplace = 'http://www.linkplus.com/xQWE=';
     $(this).attr('href', href.replace(strToReplace, ""));
  });
});

Above we use replace to replace the start of the link with an empty string.

Upvotes: 0

user9263373
user9263373

Reputation: 1074

Change your code on line 3 to

$(this).attr('href', $(this).attr('href').replace('http://www.linkplus.com/xQWE=', ''));

Full code should be

$(function() {
  $('link-active').each(function() {
     $(this).attr('href', $(this).attr('href').replace('http://www.linkplus.com/xQWE=', ''));
     });
});

Upvotes: 0

dfsq
dfsq

Reputation: 193261

It's convenient to use attr method like this:

$(function() {
  $('.link-active').attr('href', function(i, href) {
    return href.replace('http://www.linkplus.com/xQWE=', '');
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a class="link-active" href="http://www.linkplus.com/xQWE=http://www.example.com">Get</a>

Upvotes: 0

user3440782
user3440782

Reputation: 144

First thing is While representing a class in jQuery try using dot notation..

$(function() {
  $('.link-active').each(function() {
     $(this).attr('href').remove('http://www.linkplus.com/xQWE=');
     });
});

Upvotes: 0

Barry Kaye
Barry Kaye

Reputation: 7761

Amend $('link-active') to $('.link-active').

Upvotes: 0

Related Questions