I have the following code
<!DOCTYPE html>
<html>
<head>
<script>
var object = document.getElementsByName("test");
console.log(object[0]);
</script>
</head>
<input type="hidden" name="test" value="Hi"/>
</body>
</html>
I need it to log "Hi", though it is failing, It says that index [0] is undefined even though when only console logging the object I can see it perfectly along with the value.
I tried using it without an index and it failed obviously because it is a NodeList, I can't see exactly what is wrong and I tried to fix it a lot. I'm sure that index 0 is there and that there is value though I cannot access it..
I have the following code
<!DOCTYPE html>
<html>
<head>
<script>
var object = document.getElementsByName("test");
console.log(object[0]);
</script>
</head>
<input type="hidden" name="test" value="Hi"/>
</body>
</html>
I need it to log "Hi", though it is failing, It says that index [0] is undefined even though when only console logging the object I can see it perfectly along with the value.
I tried using it without an index and it failed obviously because it is a NodeList, I can't see exactly what is wrong and I tried to fix it a lot. I'm sure that index 0 is there and that there is value though I cannot access it..
Share Improve this question asked Dec 30, 2013 at 16:51 AliAli 3,4614 gold badges19 silver badges31 bronze badges 2-
1
Your code seems working fine, Just move your
<input>above the<script>Demo: ` jsfiddle/tSN5U` – Krish R Commented Dec 30, 2013 at 16:55 - This is a better jsFiddle example: jsfiddle/tSN5U/1 If the script is before the html, it doesn't work. If the script is after the html, it works. – Steve Wellens Commented Dec 30, 2013 at 17:05
4 Answers
Reset to default 6It's because your javascript is executing before the DOM pletes loading.
If you put your script after the <input>, your console will show up an [HTMLInputElement]. Then show up the value
<!DOCTYPE html>
<html>
<head>
</head>
<input type="hidden" name="test" value="Hi"/>
<script>
var objectTag = document.getElementsByName("test");
console.log(objectTag[0].value);
</script>
</body>
</html>
The console is returning undefined because you're trying to access a DOM element (the input) before it has even been parsed by the browser.
Place your <script> after the HTML you're trying to access.
<body>
<input type="hidden" name="test" value="Hi"/>
<script>
var object = document.getElementsByName("test");
console.log(object[0]);
</script>
</body>
Try this :
<!DOCTYPE html>
<html>
<head>
</head>
<input type="hidden" name="test" value="Hi"/>
<SCRIPT language=javascript>
var object = document.getElementsByName("test").value;
console.log(object);
</script>
</body>
</html>
It is because you are getting the Dom elements before it's loading finished
use the script as below
<input type="hidden" name="test" value="Hi"/>
<script>
var object = document.getElementsByName("test");
console.log(object[0]);
</script>
or you can use external Javascript file and place your coding in javascript file as below
$(document).ready(function(){
var object = document.getElementsByName("test");
console.log(object[0]);
}