2013-06-07 15 views
8

Zakładając następujący tag skryptu w losowej dokumentu HTML:Jak znaleźć <script> elementów o określonej wartości atrybutu "typ"?

<script id="target" type="store"> 
    //random JavaScript code 
    function foo(){ 
     alert("foo"); 
    } 
    foo(); 
</script> 

Czy ktoś może wyjaśnić dlaczego następujące wyrażenie nie znajdzie wszystkie elementy script o wartości store dla ich atrybutu type.

var sel = $('#target script[type="store"]'); 

jQuery wersja: v1.7.2 Chrome wersja: 25.0.1364.172 (działa na Debian Squeeze)

+6

Dlaczego ten selektor złożony? Ponieważ tylko jeden element może mieć podany identyfikator, powinieneś po prostu użyć '$ ('# cel')' –

+0

OP jest zainteresowany "wszystkimi elementami". – RedYetiCo

Odpowiedz

10

Twój selektor $('#target script[type="store"]') będzie pasować do dowolnego tagu skrypt typu store który jest dzieckiem elementu z id target. Tak nie jest w przypadku twojego przykładowego HTML.

Jeśli chcesz wybrać wszystkie znaczniki skryptu o typie store, twój selektor powinien wyglądać mniej więcej tak: $('script[type="store"]').

Jeśli chcesz tylko wybrać konkretny znacznik skryptu o identyfikatorze target, możesz użyć tylko $('#target'). Nie trzeba być bardziej szczegółowym, ponieważ identyfikator powinien być unikalny dla tego elementu. Tylko przy użyciu selektora identyfikatora byłoby bardziej efektywne, jak również, ponieważ jQuery wtedy mógłby wykorzystać rodzimą document.getElementById() aby wybrać element (mikro-optymalizacji Być może, ale nadal ...)

1

użytkowania tego

var sel = $('script#target[type="store"]'); 
1

Trzeba to -

var sel = $('#target[type="store"]'); 
1

musisz wykonać

var sel = $('script#target[type="store"]'); 
6

Bo co napisałeś środki Znajdź każdą script elementu z atrybutem type równym store i bycie potomek z #target (ze względu na miejsce).

Można zrobić coś takiego:

var sel = $('script#target[type="store"]'); 

ale nie jest to konieczne, ponieważ już ID identyfikuje element - żadnych elementów w dokumencie mogą dzielić ten sam identyfikator.

Jeśli rozumiem Twój opis dobrze, czego potrzebujesz to:

var sel = $('script[type="store"]'); 

jeszcze jedno: nie należy używać atrybutu type do tego. It has a very specific purpose:

Atrybut type podaje język skryptu lub formatu danych . Jeśli atrybut jest obecny, jego wartość musi być poprawnym typem MIME . Nie można określić parametru zestawu znaków. Domyślną wartością, która jest używana, gdy atrybut jest nieobecny, jest "text/javascript".

Proponuję więc użyć data-type zamiast type.

1

W tym selektorze szukasz tagu skryptu z type = "store" wewnątrz znacznika skryptu. Należy starać:

$('script#target[type="store"]'); 
+8

Świetnie. Było już 4 identyczne odpowiedzi. Potrzebowaliśmy jeszcze jednego ... –

+0

@dystroy Nie nienawidź tego faceta, był po prostu SCITE :) –

0

Najkrótsza możliwe wyjaśnienie:

Próbujesz kierować na skrypt podrzędny z #target.

Na przykład, jeśli znaczniki były do ​​skutku ...

<div id="target"><script type="store"></script></div> 

... Twój wybór jQuery będzie działać.

aby zaznaczyć wszystkie elementy skrypt typu pewnej wartości zrobić:

$('script[type="value"]') 

Aby wybrać konkretny skrypt, który ma identyfikator, a także, czy:

$('script#id[type="value"]') 

One można również ustawić docelowy skrypt bez identyfikatorów:

<script> 
    // Prevent Global Scope Pollution 
    (function($){ 

    // DO - Use it outside of an event... 
    var Script_Self = $('script').last(); 
    console.log(Script_Self); 

    // DONT - Use it inside of an event... 
    $(document).on('ready', function() { 
     var Script_Self = $('script').last(); 
     console.log(Script_Self); 
    }); 

    })(jQuery); 
</script> 

<script> 
    // Prevent Global Scope Pollution 
    (function($){ 

    // The event will target me :(

    })(jQuery); 
</script> 

Po uruchomieniu tego kodu zdasz sobie sprawę, że pierwszy skrypt zostanie skierowany na siebie i zostanie wyświetlony na konsoli, a także docelowy skrypt w dokumencie z komentarzem // The event will target me :(.

Powodem tego jest to, że poza zdarzeniem, ostatnim elementem, który ma zostać dodany do DOM, jest znacznik skryptu wykonujący instrukcje, co oznacza logicznie ostatni tag skryptu w $('script').

Jednak wewnątrz zdarzenia, w tym przypadku document.on('ready'), czeka, aż DOM zakończy ładowanie, aby wszystkie dodatkowe znaczniki skryptów, które mogą istnieć w dokumencie, zostaną załadowane i zastąpią pożądany cel .last().

Powiązane problemy