How to optimize $ .find (). First ()?

Question

I need to get the first item.

I am doing this with this code ...

$(element).find('.x').first();

As far as I understand, this code ...

• Retrieves all items from elementthat match .x,
• Removes unnecessary items;

Is there a better way to do this? How $.findOne()or something?

Answer 1

According to jQuery docs:

: -, jQuery, CSS , : , DOM-SelectorAll() . : , , CSS, .filter( ": first" ).

, :

$(element).find('.x').filter(":first")

( , .find, )

$(element).children('.x').filter(":first")

.

---

kingjiv patrick dw ( . ), , , .filter(':first') , .

$(element).find('.x').first();   // faster

$($(element).find('.x')[0]);     // fastest

Answer 2

, , . querySelector ^[docs]:

var $result;
if(element.querySelector) {
    $result = $(element.querySelector('.x'));
}
else {
    $result = $(element).find('.x').first();
}

, , element - , CSS. . , , , .., , .

, , , , jQuery.

: , : jsPerf

(function($) {
    $.fn.findOne = function(selector) {
        try {
            var element, i = 0, l = this.length;
            while(i < l && (element = this[i].querySelector(selector)) === null) {
                i++;
            }
            return $(element);
        }
        catch(e) {
            return this.find(selector).first();
        }
    };
}(jQuery));

:

DOM querySelector . , . :

• querySelector
• CSS

, jQuery.

Answer 3

, , , , .first() , :first.

, , $(element).find(".x:first") . .first . jquery, , .

http://jsperf.com/jquery-select-first

, -, [0], jquery :

$($(element).find(".x")[0])

: . . -, .

Answer 4

$(element).find('.x:first');

Answer 5

:first:

$(element).find('.x:first')

Answer 6

:

$('a:first');

, , " ", ".x" ". :

$('.x:first', element);

Answer 7

first-child pseudo class?

$(element).find('.x:first-child')

,

<div>
   <p></p>
</div>
<div>
   <p></p>
</div>

, ( ). mnetions: -, , ,

Answer 8

.find(), , .

, .x ( jQuery) ( DOM).

Mrchief, , , , .

Answer 9

, jQuery , , , :first.

.filter(":first") , , .find() [0].

, .find() :

$('.x', element)

.x , .

Answer 10

You can combine calls $(element)and .find()using the descendant selector; I'm not sure about performance comparison:

$("#element .x").first().hide();