Javascript getting the value of element dosn't work

Question

i'm trying to obtain the value of an element with javascript but i'm getting undefined as it's value even if i know it isn't.

<!DOCTYPE html>
<html>
<body>

<p>Click "Try it" to display the first array element, after a string split.</p>

<button onclick="myFunction()">Try it</button>

<p id="demo"></p>

<script>
function myFunction() {
    var str = "a,b,c,d,e,f";
    var arr = str.split(",");
    document.getElementById("demo").innerHTML= arr[0];
    alert(document.getElementById("demo").value);
}
</script>

</body>
</html>

How can i obtain the value of "demo" once i changed it?

A `
` element does not have a `.value`. Just access it as `.innerHTML` like you assigned to. — Bergi, Mar 25 '17 at 19:31
The one sets plain text, the other parses html and is a XSS attack vector http://stackoverflow.com/q/24427621/1048572 — Bergi, Mar 25 '17 at 19:44

score 2 · Accepted Answer · answered Mar 25 '17 at 19:30

You are actually setting the innerHTML attribute of the #demo element, not value.

function myFunction() {
    var str = "a,b,c,d,e,f";
    var arr = str.split(",");
    document.getElementById("demo").innerHTML = arr[0];
    alert(document.getElementById("demo").innerHTML);
}

<p>Click "Try it" to display the first array element, after a string split.</p>

<button onclick="myFunction()">Try it</button>

<p id="demo"></p>

Javascript getting the value of element dosn't work

1 Answers1