Change href attribute using jquery

Question

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="js/jquery-1.10.2.min.js" ></script>

<title>Untitled Document</title>
<script type="text/javascript">    
$(document).ready(function(){
    $('#show').click(function(){
    var href =  $(this).attr('href');    
    alert(href);
    });
    }); 
</script>
<style>
.show{
    background:#693;
    color:#000;
    text-decoration:none;
}
</style>            
</head>        
<body>
<p class="credits">Figure credits goes here</p>
</figure>    
<p>&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test</p>    
<p>&nbsp;</p>    
<figure class="image"><img alt="" height="228" src="http://localhost/rvrite/uploader/img/541akki.png" width="300" />
<figcaption>
<p><a class="figure-lable" id="f2" name="figure2">Figure 2&nbsp;</a></p>    
<p>&nbsp;</p>    
<p>Caption</p>
</figcaption>    
<p class="credits">Figure credits goes here</p>
</figure>    
<p>&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo <a href="#table2(t2)" id="ytD2F">table2</a>&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;</p>    
<table border="1" cellpadding="1" cellspacing="1" style="width: 500px;">
    <caption><a class="figure-lable" id="t1" name="table1">Table 1&nbsp;</a>caption goes here</caption>
    <tbody>
        <tr>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
            </tr>
        <tr>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
        </tr>
        <tr>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
        </tr>
    </tbody>
</table>    
<p>demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;demo test&nbsp;</p>    
<table border="1" cellpadding="1" cellspacing="1" style="width: 500px;">
    <caption><a class="figure-lable" id="t2" name="table2">Table 2&nbsp;</a>caption goes here</caption>
    <tbody>
        <tr>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
        </tr>
        <tr>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
        </tr>
        <tr>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
        </tr>
    </tbody>
</table>
<p>&nbsp;</p>
<input type="button" value="ok" id="show" />
</body>
</html>

What I want to do is to replace all my href string href="#table2(t2)" with the string present inside the braces :(t2)

if it is : href="#table3(t3) it should be replace with t3

how can I do it using jquery?

possible duplicate of [How to change the href for a hyperlink using jQuery](http://stackoverflow.com/questions/179713/how-to-change-the-href-for-a-hyperlink-using-jquery) — Bram Vanroy, Apr 06 '15 at 08:33
Changing hrefs in this way is pretty unusual and probably unnecessary. I'm pretty sure there's a better solution to whatever you are trying to do. — Roamer-1888, Apr 06 '15 at 10:55

score 2 · Accepted Answer · edited Apr 06 '15 at 12:20

2

var href1=document.getElementsByTagName('a');
    for(i=0;i<href1.length;i++) {
       var val=href1[i].getAttribute('href');
        if(val!=null) {
           var str=val.substring(val.lastIndexOf('(')+1,val.lastIndexOf(')'));
           href[i].setAttribute('href',str);
        }
    }

Check Here

edited Apr 06 '15 at 12:20

Amit Soni

3,216
6
31
50

answered Apr 06 '15 at 06:15

Brijesh Bhatt

3,810
3
18
34

Check the demo.. @imrahul – Brijesh Bhatt Apr 06 '15 at 06:28
srry friend i hope u did not get my point what i want to do get the value of href and then replace it with value present in the braces of that particular string – imrahul Apr 06 '15 at 06:50
i need to replace the val with str in href onclick event ..how would i replace – imrahul Apr 06 '15 at 07:58
Check now .. you need to add $(this).attr("href",str); in place of alert(str) @imrahul – Brijesh Bhatt Apr 06 '15 at 08:32
suppose if i want to apply this effect on each and every href tag of a page how can i do it and thankx for helping me till this time – imrahul Apr 06 '15 at 09:25
@imrahul check the updated fiddle code demo.. i think it helps.. :) – Brijesh Bhatt Apr 06 '15 at 09:33
@bisht my reqmnt is to replace all href tag on a page so i can't select the the hre on the basis of id can u help me to select all the href tag on a page without a particular id or class – imrahul Apr 06 '15 at 09:50
@imrahul Check now ..this is now exactly what you have told me.. See fiddle also.. – Brijesh Bhatt Apr 06 '15 at 10:28
hey hi i m updating my question i hope u cn help me with that – imrahul Apr 06 '15 at 11:10
http://stackoverflow.com/questions/29470624/replace-href-value-in-dom-variable plzz check – imrahul Apr 06 '15 at 11:46

score 0 · Answer 2 · answered Apr 06 '15 at 06:28

0

var regExp = /\(([^)]+)\)/;
var val="table3(t3)";
var matches = regExp.exec(val);
alert(matches[1])

check here

answered Apr 06 '15 at 06:28

Amit Soni

3,216
6
31
50

What if the string is like "tab(le3(t3)" ?? @AmitSoni – Brijesh Bhatt Apr 06 '15 at 06:33
In that case, it will not work as we have defined a pattern.. You have to make sure for ID generation. Moreover these kind of scenarios should be handle with regular expression. – Amit Soni Apr 06 '15 at 06:35

Change href attribute using jquery

2 Answers2

Linked

Related