Jquery $(:text) and $(input[type="text"])

Question

$(:text)和$(input[type="text"]) Jquery选择器之间有什么区别。

Answer 1

As of jQuery 1.5.2, :text selects input elements that have no specified type attribute (in which case type="text" is implied).

This difference in behavior between $( ":text" ) and $( "[type=text]" ), can be seen below:

$( "<input>" ).is( "[type=text]" ); // false
$( "<input>" ).is( ":text" ); // true

Additional Notes:

Because :text is a jQuery extension and not part of the CSS specification, queries using :text cannot take advantage of the performance boost provided by the native DOM querySelectorAll() method. For better performance in modern browsers, use [type="text"] instead. https://api.jquery.com/text-selector/

Answer 2

From the Jquery api :

$( ":text" ) is equivalent to $( "*:text" ).

so equivalent of $('input[type="text"]') is $("input:text")

Answer 3

$(input[type="text"]) will select all the input tags which have the type specified

$(:text) will select all the input tags which have the type specified or not defined

<input type="text" name="text1" value="abc" />

<input name="text2" value="xyz" />

$(input[type="text"]) will select the first input tag only

$(:text) will select both input tages

check js fiddle demo