2010-08-18 9 views
6

W jQuery jest selektor $ ("[id = foo]") mniej wydajny niż $ ('# foo')?

Odpowiedz

16
  • krótkie i proste: TAK!

  • długa historia (jeszcze krótki faktycznie)

    $('[id=foo]') 
    

    wykorzystuje Sizzle (CSS silnika zapytanie), aby wybrać element, natomiast

    $('#foo') 
    

    bezpośrednio wywołuje getElementById.

Aby mieć bardzo długą historię, zaczynamy: $('[id=foo]') jest synonimem $('*:[id=foo]') który używa selektora uniwersalnego. Oznacza to, że zapytuje węzły w twoim znaczniku, a następnie sprawdza, które z nich mają numer id === foo (który, miejmy nadzieję, dopasuje tylko jeden element, IDs = unikalny). To oczywiście kosztowne, dość kosztowne. I dlatego nigdy nie powinieneś pisać takiego selektora! Zawsze w pełni kwalifikować, jeśli to możliwe, jak $('span:[id=foo]')

+0

Ahh heres sub-pytanie do ciebie, to JANDY - jest '$ ('span: [id = foo]') 'just longhand dla' $ (span # foo) 'lub inny selektor w ogóle? – HurnsMobile

+0

@HurnsMobile: Wcale nie. '$ ('span: [id = foo]')'. Właściwie poleciłabym przejrzenie kodu inicjującego jQuery tutaj. jQuery analizuje niektóre selektory do bezpośredniego wywołania 'getElementById' lub' getElementsByTagName', myślę, że '$ (span # foo)' jest jednym z nich. Jest to zdecydowanie szybsze niż '$ ('span: [id = foo]')'. To wyrażenie przejdzie w Sizzle i to oczywiście trwa dłużej niż jedna z wyżej wymienionych metod. – jAndy

+0

Bardzo pouczające, wielkie dzięki. Powodem, dla którego rozważałem użycie czegoś innego niż $ ("# foo") do kierowania na identyfikator, jest to, że id, na który celowałem miał okres, co jest oczywiście problematyczne, ponieważ jQuery zinterpretuje to jako id i klasę. Używając $ ("[id = Address.State]", na przykład, mógłbym obejść problem. Innym sposobem obejścia tego problemu jest podwójne wyjście z okresu, jak w $ ("# Address \\. State"), ale myślałem, że podwójne ucieczki mogą być mniej czytelne. Jednak biorąc pod uwagę utratę wydajności, którą wskazałeś, prawdopodobnie i tak by to wykorzystałem. – jbyrd

1

tak.

Najszybszy selektor jQuery jest selektor ID $ ('# foo'), ponieważ mapy bezpośrednio do natywnego metody JavaScript, getElementById()

Powiązane problemy