Javascript获取imgsrc并在div中显示链接
我只是一个javascript的初学者,我正试图让javascript从特定的图像和特定的类中获取图像src,并将src放入div中Javascript获取imgsrc并在div中显示链接,javascript,jquery,html,Javascript,Jquery,Html,我只是一个javascript的初学者,我正试图让javascript从特定的图像和特定的类中获取图像src,并将src放入div中 <div class="result"></div> <div class="ilist"> <a href="#"><img src="images/dog.jpg" class="thumbnail"></a> <a href="#"><img src="images/b
<div class="result"></div>
<div class="ilist">
<a href="#"><img src="images/dog.jpg" class="thumbnail"></a>
<a href="#"><img src="images/bird.jpg" class="thumbnail"></a>
<img src="images/cat.jpg" class="selected__img"> // THIS IS THE DESIRED IMAGE
</div>
很抱歉,我是个新手,但我正在努力学习..您需要迭代元素,因为您选择了一个
\uu img
您可以使用0,如下所示:
var simg = document.getElementsByClassName('selected__img')[0].src;
document.getElementsByClassName("result").innerHTML = simg;
getElementsByClassName
是节点列表集合。因此,您需要使用[0]
获取单个节点:
var simg = document.getElementsByClassName('selected__img')[0].src;
document.getElementsByClassName("result")[0].innerHTML = simg;
在这种特定情况下,使用querySelector
metod更方便,它返回一个元素:
var simg = document.querySelector('.selected__img').src;
document.querySelector(".result").innerHTML = simg;
或者因为您正在使用jQuery:
var simg = $('.selected__img').attr('src');
$(".result").text(simg);
$(文档).ready(函数(){
$('img')。悬停(函数(){
$('.result').html($(this.attr('src'));
});
});代码>
图像路径
//这是所需的图像
getElementsByCassName()方法以节点列表对象的形式返回文档中具有指定类名的所有元素的集合
NodeList对象表示节点的集合。可以通过索引号访问节点。索引从0开始
试试这个:
<script>
var simg = document.getElementsByClassName('selected__img');
var src=simg[0].src;
var resutlObj=document.getElementsByClassName("result")[0]
resutlObj.innerHTML = src;
</script>
//这是所需的图像
<script>
var simg = document.getElementsByClassName('selected__img');
var src=simg[0].src;
var resutlObj=document.getElementsByClassName("result")[0]
resutlObj.innerHTML = src;
</script>