使用jQuery处理href属性

Question

I have a few URLs and would like to add a slash (/) before them.

This is how they look in my HTML:

<li class="link">
    <a href="products/">Products</a>
</li>
<li class="link">
    <a href="team/">Team</a>
</li>
<li class="link">
    <a href="contact/">Contact</a>
</li>

How can I manipulate the link in the href attribute, so it looks eg like this: /products/ ?

The solution must work on IE 10!

Answer 1

You can use jQuery attr() method to do it like following.

 $('.link a').attr('href', function(){ return '/' + $(this).attr('href'); }) 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <ul> <li class="link"> <a href="products/">Products</a> </li> <li class="link"> <a href="team/">Team</a> </li> <li class="link"> <a href="contact/">Contact</a> </li> </ul> 

Answer 2

You can use attr() to change links

 $('li.link a').each(function() { $(this).attr('href', '/' + $(this).attr('href')); }) 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <li class="link"> <a href="products/">Products</a> </li> <li class="link"> <a href="team/">Team</a> </li> <li class="link"> <a href="contact/">Contact</a> </li> 

Answer 3

您可以使用$(element).attr("href", "http://example.com")更改URL。

Answer 4

Could be something like this

var name = "/" + $('.link').children().attr('href');
$('.link').children().attr('href',name);

Checkout the jquery .attr() documentation http://api.jquery.com/attr/