jQuery 1.7.1 - Text input's 'value' not updating in Firebug Inspect element but is on screen

Question

Using jQuery 1.7.1, I have noticed that the value attribute/property of a text input field does not update when I view it in Firebug's Inspect Element tool, but does update on the screen, i.e. in the actual visible text box.

For example, when changing the value of a text with the following (used inline):

jQuery(function() {
    jQuery('#event').val("test");
});

the text box itself displays test but Firebug's Inspect Element does not represent the change:

<input type="text" value="" placeholder="" id="event" name="event" class="input-text">

I'm sure I have seen the value change in Firebug before using older jQuery, however not in this scenario, nor that of a colleague of mine also using jQuery 1.7.1.

Is this a quirk/bug of this particular version of jQuery or have I missed a step somewhere?

Answer 1

The value attribute always shows the defaultValue. Firebug never displayed the current value in the attribute. The current value is always visible on the screen.

This has nothing to do with Firebug or jQuery, it is the HTML standard.

Answer 2

The attribute value never changes, only the property.

http://jsfiddle.net/cc5Pm/1/

var input = document.getElementsByTagName("input")[0];
setInterval(function(){
    input.value = parseInt(input.value) + 1;
    console.log(input.value, input.getAttribute("value"));
},1000);