It outputs undefined for both. It should output lpoop and /poop. No errors are given
function add() {
console.log("add")
var l = document.createElement("img")
l.setAttribute("src", "/poop")
l.src = "/poop"
l.setAttribute("class", "l")
l.className = "lpoop"
document.getElementById("b").appendChild(l)
}
function find() {
console.log("find");
const elm = document.getElementById("b").firstChild;
console.log(elm.className);
console.log(elm.src);
}<button onclick="add()">
hi
</button>
<button onclick="find()">
find
</button>
<div id="b">
</div>If there is any more detail you want pls comment.
function add() {
console.log("add")
var l = document.createElement("img")
l.setAttribute("src", "/poop")
l.setAttribute("class", "l")
document.getElementById("b").appendChild(l)
}
function find() {
console.log("find");
const elm = document.getElementById("b").firstChild;
console.log(elm.getAttribute("src"));
console.log(elm.getAttribute("class"));
}<button onclick="add()">
hi
</button>
<button onclick="find()">
find
</button>
<div id="b"></div>When you use elem.attr it means that you are getting the JS Attribute of the element, not the HTML attribute.
The .getAttribute() function will get the HTML attribute.