JQuery Series Equivalents

Are the following equivalent? What idiom do you use and why?

$('#form1 .edit-field :input')
$('#form1 .edit-field').find(':input')
$('.edit-field :input', '#form1')
$(':input', '#form1 .edit-field')
+3
source share
4 answers

I would use either # 2 or # 4:

$('#form1 .edit-field').find(':input')
$(':input', '#form1 .edit-field')

Both of the above are essentially the same. Behind the curtain, when you specify the context, this is what happens anyway:

jQuery( context ).find( selector );

I would avoid # 1 and # 3 because they are significantly slower than # 2 / # 4.


EDIT: Just did a quick test: 1000 input elements using YOUR selectors:

$('#form1 .edit-field :input')            // 55ms
$('#form1 .edit-field').find(':input')    // 21ms
$('.edit-field :input', '#form1')         // 47ms
$(':input', '#form1 .edit-field')         // 18ms
+8
source

. , end(), "# form1.edit-field", :

$('#form1 .edit-field').find(':input')
   ...
.end().find(':hidden')...
.end()...

, , , . , , :

$('.edit-field :input', $('#form1'))
$(':input', $('#form1 .edit-field'))

, .

, , , , .

+4

jQuery, , , . :

$('#form1').find('.edit-field').find(':input')

, . , end().

0
source

I would use different forms based on what I already have and on what elements I also need to work. For example, if I need to work with other fields in the same form, I will save the link to $ ('# form1') to save its search several times.

0
source

Source: https://habr.com/ru/post/1704094/


All Articles