How to target the img element in JavaScript to change img src.
<body>
<div class="cover">
<img src="img.jpg" width="60" height="60">
</div>
</body>
-
2And what did you try before coming here ?Mritunjay– Mritunjay2016-07-06 06:18:22 +00:00Commented Jul 6, 2016 at 6:18
-
1This is a really basic question, you should try to google it first.pmrotule– pmrotule2016-07-06 06:19:32 +00:00Commented Jul 6, 2016 at 6:19
Add a comment
|
4 Answers
document.querySelector(".cover img").src = "/test/test.jpg";
please visit HTML DOM querySelector() Method for more information (compatibility, ...)
Comments
element.querySelector('img') can get you there as well.
var cover = document.getElementsByClassName('cover')[0],
img = cover.querySelector('img');
img.src = 'http://placehold.it/60x60';
<div class="cover">
<img src="img.jpg" width="60" height="60">
</div>
Comments
First select you parent class and then using that select your child element.
var a = document.querySelector(".cover");
var b = a.querySelector("img");
b.style.width = "500px";
b.style.height = "500px";
b.src = "https://source.unsplash.com/category/nature";
Comments
If you do not want to support legacy browsers you can do with with document.querySelector:
document.querySelector(".cover img").setAttribute("src", "anotherimage.png");
