如何获得这样的图像？

Question

<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>

上面，数据层的值是一个用户输入的数字，有多个数据层，所以您只能得到用户输入的图像：

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

那么如何将"a“的href转换为src图像呢？就像这样：

<a href="1.jpg">GO</a>，也许这个能行？

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

非常感谢您的帮助！

Answer 1

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

或

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

与用户输入：

<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>

Answer 2

您必须先获取图像src属性，然后将其放进a的href：

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

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

或者使用普通的javascript

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

a.href = image.src;

Answer 3

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;
}

这将遍历所有.thumb，并将它们的href设置为它们内部的.avatar图像元素的src。