replace href text in HTML using Javascript
Question
Is it possible to use Javascript to change the a href value in the following code from href="http://**store**.mystitexxx.co.nz" to href="http://**www**.mystitexxx.co.nz" ? It needs to be specific to this DIV or image, ie not global
<div id="ctl00" class="hidden-xs">
<h1 class="logo clearfix">
<a href="http://store.mystorexxx.co.nz" title="My Store"><img class="img-responsive"src="/user/files/logo.png?t=1601271313" title="My Store" alt="My Store"/></a>
</h1>
</div>
3 answers
solution1
3 2016-01-27 04:04:58
Since you need it to be specific to this exact link, just:
document.getElementById("link").href = "http://www.mystitexxx.co.nz";
<div id="ctl00" class="hidden-xs"> <h1 class="logo clearfix"> <a href="http://store.mystorexxx.co.nz" title="My Store" id="link"><img class="img-responsive"src="/user/files/logo.png?t=1601271313" title="My Store" alt="My Store"/></a> </h1> </div>
With jQuery:
$("#link").attr("href", "http://www.mystitexxx.co.nz");
Edit: If you don't have control over the HTML to add an ID. (If you did, why would you want to change the href with Javascript? :P)
document.querySelector("h1.logo a").href = "http://www.mystorexxx.co.nz"; //$("h1.logo a").attr("href", "http://www.mystitexxx.co.nz");
<div id="ctl00" class="hidden-xs"> <h1 class="logo clearfix"> <a href="http://store.mystorexxx.co.nz" title="My Store"><img class="img-responsive"src="/user/files/logo.png?t=1601271313" title="My Store" alt="My Store"/></a> </h1> </div>
solution2
2 ACCPTED 2016-01-27 04:33:33
Gee, it seems like all the other answers are pretty complicated.
It's simple:
jQuery('h1.logo a').attr('href', 'http://www.mystitexxx.co.nz');
Or, if you don't know where to put this / how to include it, then:
Between your <head> and </head> tags, add this:
<script>
jQuery(function($) {
$('h1.logo a').attr('href', 'http://www.mystitexxx.co.nz');
});
</script>
And, if you don't already have jQuery loading, then just add it in like so (again, between <head> tags):
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<script>
jQuery(function($) {
$('h1.logo a').attr('href', 'http://www.mystitexxx.co.nz');
});
</script>
solution3
0 2016-01-27 04:07:09
<html>
<head>
<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
<style type="text/css">
.selected{
background-color : green;
}
</style>
<script>
$(document).ready(function () {
$('.logo a img.img-responsive').attr('src', "http://www.mystitexxx.co.nz")
});
</script>
</head>
<body>
<div id="ctl00" class="hidden-xs">
<h1 class="logo clearfix">
<a href="http://store.mystorexxx.co.nz" title="My Store"><img class="img-responsive"src="/user/files/logo.png?t=1601271313" title="My Store" alt="My Store"/></a>
</h1>
</div>
</body>
</html>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.