I have a plain <input>
element.
I would expect document.querySelectorAll('input[type="text"]')
to retrieve (at least) that input, since the default input type is text
.
But querySelectorAll
does not return that input unless I explicitly set type="text"
.
I have two questions:
- Why does querySelectorAll ignore the input with an implicit
type="text"
? - Is there a query to target an input whose implicit type is
text
that excludes all inputs whose types are nottext
?
Here is an example document illustrating the question:
var output = document.getElementById('output');
var textInputs = document.querySelectorAll('input[type="text"]');
output.innerText = 'input[type="text"] - ' + textInputs.length + ' elements';
var inputs = document.querySelectorAll('input');
output.innerText += '\ninput - ' + inputs.length + ' elements';
output.innerText += '\n\nFirst input type: ' + inputs[0].type;
#output {
font-family: monospace;
}
<form>
<input>
<input type="text">
<div id="output"></div>
</form>
And here is the JavaScript output in my browser (Chrome):
input[type="text"] - 1 elements
input - 2 elements
First input type: text