Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

What's the difference between document.getElementById("test").value and document.getElementById("test").innerHTML

document.getElementById("test").value

document.getElementById("test").innerHTML

Does the first mean the address and the second mean the value stored at the address? Also, where can I find documentation on the value property?

like image 500
user784637 Avatar asked Jan 29 '12 22:01

user784637


People also ask

What is the difference between .innerHTML and .value in JavaScript?

value gives you the currently-set value of a form element (input, select, textarea), whereas . innerHTML builds an HTML string based on the DOM nodes the element contains.

What is the use of document getElementById .value in JavaScript?

The getElementById() method returns an element with a specified value. The getElementById() method returns null if the element does not exist. The getElementById() method is one of the most common methods in the HTML DOM. It is used almost every time you want to read or edit an HTML element.

What is .innerHTML in JavaScript?

The innerHTML is a property of the Element that allows you to get or set the HTML markup contained within the element: element.innerHTML = 'new content'; element.innerHTML; Code language: JavaScript (javascript)

Why .innerHTML is used?

The innerHTML property is part of the Document Object Model (DOM) that allows Javascript code to manipulate a website being displayed. Specifically, it allows reading and replacing everything within a given DOM element (HTML tag).


1 Answers

.value gives you the currently-set value of a form element (input, select, textarea), whereas .innerHTML builds an HTML string based on the DOM nodes the element contains.

For a simple example, go to the JS Fiddle demo, and enter a new value into the input and then move out of the input.

The test uses the following JavaScript:

document.getElementById('input').onchange = function(){
    alert('innerHTML: ' + document.getElementById('input').innerHTML + '; whereas value: ' + document.getElementById('input').value);
};

(The above text updated, following a comment left by am not i am, in comments below.)

like image 102
David Thomas Avatar answered Sep 27 '22 22:09

David Thomas