jQuery znaleźć kontra doboru kontekstowego

mający następujący kod HTMLjQuery znaleźć kontra doboru kontekstowego

<div class="something"> 
    <p>Some text</p> 
</div> 
<div class="somethingElse"> 
    <p>some other text</p> 
</div>

myślę następujące jquery fragmenty są identyczne (będzie miał taki sam wynik):

$(".something").find("p").css("border", "1px solid red"); 

$("p", ".something").css("border", "1px solid red");

Moje pytanie brzmi, czy jednym fragmencie jest lepszy od drugiego i powinien być używany

Źródło

2010-02-26 harpax

Dlaczego nie używasz $ (". Coś> p")? To czysty CSS. –

@Xr: To byłoby raczej '$ (". Coś p ")'. – Gumbo

$ (". P p.") Jest najwolniejszą dostępną metodą, ponieważ najwyraźniej jQuery przeszuka od prawej do lewej, znajdując najpierw wszystkie elementy p w dokumencie, a następnie filtrując je dla przodka. $ (". something"). find ("p") jest najszybszy, jak na moją odpowiedź poniżej. – BrianFinkel

Połączenia nie są identyczne.

Według Brandona Aarona, który najwyraźniej pracował na jQuery, a także według testów na żywo here, metoda wyszukiwania jest zawsze szybsza. Zobacz wyniki na zrzucie ekranu poniżej. Proszę o komentarz, jeśli czegoś brakuje.

Przy 10% lub większej różnicy prędkości, w zależności od przeglądarki zdecydowanie warto skorzystać z funkcji Znajdź.

Dalsze wyjaśnienie na stronie Brandon to here.

Results of performance comparison between jQuery context and jQuery find method

Źródło

2012-01-28 15:12:33 BrianFinkel

Dodałem test użycia kontekstu "właściwą drogę" zgodnie z wyżej wymienionym artykułem - dostarczając węzeł DOM dla drugiego argumentu. Jak na ironię, jest jeszcze wolniej: http://jsperf.com/jquery-find-vs-context-2/3 – Grinn

Twój wykres pokazuje przeciwieństwo tego, co powiedziałeś. czerwona linia jest kontekstem i wydaje się szybsza niż niebieska linia (metoda find()). Czy brakuje mi czegoś? –

Przepraszam, moje zamieszanie ... na pierwszy rzut oka wygląda na to, że jest odwrotnie, ale oś X to: operacje na sekundę - tak po niezgrabnym, że ma sens –

Obie rozmowy są identyczne. To drugie wezwanie jest tłumaczone na poprzednie. Jeśli chcesz pominąć krok tłumaczenia, skorzystaj z poprzedniego.

Źródło

2010-02-26 14:35:39 Gumbo

Tak, co powiedział ... –

to było szybkie .. dzięki – harpax

Może być oczywiste, ale jestem niepewny: czy to jest to samo, gdy zewnętrzny selektor jest już obiektem jQuery? Podobnie jak $ sth.find ("p") jest nieco szybszy niż $ ("p", $ sth.)? – SunnyRed

można myśleć o jednym przypadku zastosowania, w którym za pomocą formularza context może być korzystne, - w przypadku, jeśli z kontekstu nie jest zawarty w przypadku zmiennej, która może być zerowa.

Na przykład:

// Only affect matching items that are descendants of '#parent' 
do_something($('#parent')); 
// Affect all matching items 
do_something(); 

function do_something($parent_element){ 
    $('.child', $parent_element).each(function(){ }); 
}

Drugi raz do_something() nazywa, gdybyśmy używali $parent_element.find() to nie udało, podczas gdy w tym przykładzie, jeśli $parent_element jest niezdefiniowany lub opróżnić kontekst jest zerowy, a więc: the cały dokument.

Oczywiście jest to poważny przypadek, ale pojawił się w czymś, nad czym pracowałem, więc pomyślałem, że umieści go tutaj dla potomności.

Źródło

2013-11-28 21:54:23

Find jest lepszy o 40%:

http://jsperf.com/jquery-find-vs-context-2/13

zauważyć różnicę:

$myDiv = $("myDiv") 
myDiv = "#myDiv"

przechodząc $myDiv, element jQuery jako kontekście, o 10% wolniej niż $ .odnaleźć. podczas przekazywania w #myDiv, selektor jQuery jako kontekst, jego 40% wolniejszy niż $ .find.

$ .find> kontekst.

Źródło

2013-12-12 00:31:22 dylanjha

jQuery znaleźć kontra doboru kontekstowego

Odpowiedz

Powiązane problemy