CODEWITHSUNDEEP
javascript
spoonwep
spoonwep

Reputation: 13

How to get src of an image like this?

<div data-layer="">
  <div class="area-comment-left">
    <a class="thumb" target="_blank" href="index.php">
      <img class="avatar" src="1.jpg" data-name="www">
    </a>
  </div>
</div>
<a href="">GO</a>

and above,the value of data-layer is a number which user inputs,and there are multiple data-layers,so you can only get the image by which user inputs:

<input class="floor" value="a number">

then how to change the href of "a" to the src of image? like this:

<a href="1.jpg">GO</a> maybe this will work?

var floor = $("div[data-layer="+$('.floor').val()"] .area-comment-left .thumb .avatar").attr("src");

Thank you very much for your help!

Upvotes: 0

Views: 104

Answers (3)

Sebastien
Sebastien

Reputation: 1328

$('.thumb').attr('href', '1.jpeg'); //JQuery

or

var a = document.getElementsByTagName('a')[0].href = "1.jpeg";

With user input:

<form action="" method="POST">
    <input type="text" id="txtImage"/>
    <input type="button" id="cmdOk" value="Ok"/>
</form>//could be a div but for the purpose I decided I would use a form
<script>
    $('#cmdOk').on('click', function(){ $('.thumb').attr('href', $('#txtImage').val());});
</script>

Upvotes: 2

Robin
Robin

Reputation: 7894

var thumbs=document.getElementsByClassName('thumb');
  // loop through the `.thumb`s
for(var i=0,l=thumbs.length;i<l;i++){
    thumbs[i].href=thumbs[i].getElementsByClassName('avatar')[0].src;
}

This will loop through all the .thumbs and set their href to the src of the .avatar image element inside them.

Upvotes: 0

tehsis
tehsis

Reputation: 1612

You must fetch the image src attribute first and then assing it to the a's href:

var image_src = $('.avatar').attr('src')

$('.thumb').attr('href', image_src);

or using plain javascript

var image = document.querySelector('.avatar');
var a = document.querySelector('.thumb');

a.href = image.src;

Upvotes: 0

Related Questions