I have the code below unexpectedly working and I want to know why.
Basically, I am clicking on a button to change the value of an input text field.
The input has an id of 'here' but no name or class. Yet, I am able to change its value by using dot notation here.value
Note that I am using a simple dot notation instead of a jQuery selector, bracket notation, or getElementById(id)
method. As far as I know, this should NOT work.
<input id="here" readonly>
<input type="button" id="btn" value="Click">
<script>
$(document).ready(function() {
$('#btn').on('click', function() {
// why does this dot notation work for id?
here.value = 'you clicked on the button';
// should be:
// $('#here').val('you clicked on the button');
});
});
</script>