CODEWITHSUNDEEP
javascripthtml
user5473227
user5473227

Reputation:

elements attributes return "undefined" for no reason

i have this piece of code:

function RemoveFromCart(id)
{

    var items = document.getElementById("overview").children;

    for(var i = 0; i < items.length;i++)
    {
        console.log(items[i]);
        console.log(items[i].value);
    }
}

the first log returns the actual element:

<div class="overview-item" value="0" data-total="5">1X item name - 5€<button onclick="RemoveFromCart(0)"></button></div>

but the second log returns

undefined

why is it doing this? why isn't it returning the value of the elements "value" attribute?
and how do i go about fixing it?

Upvotes: 0

Views: 90

Answers (2)

guest271314
guest271314

Reputation: 1

You are already using data-* attribute at data-total="5", as pointed out by @Pointy <div> elements do not have a .value property. You can substitute data-value="0" for value="0" and use HTMLElement.dataset to get or set the value.

console.log(items[i].dataset.value);

Upvotes: 1

Pointy
Pointy

Reputation: 413682

<div> element nodes don't have a "value" property. That's only for <input> and other form controls. If you put a "value" attribute in the tag, you have to use .getAttribute() to fetch the value.

Depending on what you're trying to do, you can inspect the children elements and check the "nodeType" property so you know what/how to access stuff.

Upvotes: 4

Related Questions