I have a table, and each cell has it's a unique ID, how to access the src value and change it?
<tr><td id="ROOM11"><img src="01.png"></td><td id="ROOM12"
This JavaScript code try to access the src but it returns with null value:
let cellid = document.querySelector("#ROOM11");
console.log(cellid.getAttribute('id'));//I manage to access the ID: returns ROOM11
cellid.setAttribute('src',02.png'); //returns with an error
cellid.getAttribute('src'); //returns with null
I maybe need to access the child element but I don't know how to access it?
Change your selector to #ROOM11 img. #ROOM11 by itself will only select the element with the id ROOM11.
let cellid = document.querySelector("#ROOM11 img");
console.log(cellid)
cellid.setAttribute('src', 'https://www.gravatar.com/avatar/0fdacb141bca7fa57c392b5f03872176?s=48&d=identicon&r=PG&f=1');
<table>
<tr>
<td id="ROOM11"><img src="01.png"></td>
</tr>
</table>