2010-10-17 2 views
19

Quelqu'un a-t-il de l'expérience/de la réflexion sur le découplage de jquery/sizzle?découplage jquery, sizzle?

ceci est pour l'intérêt général, mais voici le scénario qui a déclenché ma question:

..Je ont déjà jquery dans le projet. voulait essayer http://ecsstender.org/, ce qui nécessite le moteur de sélection Sizzle. Je ne veux pas vraiment inclure une copie de 2ème Sizzle - son déjà partie de jquery ..

  • préféreraient faire quelque chose comme ceci: http://forum.jquery.com/topic/further-decoupling-sizzle-and-jquery
  • par exemple Créez une construction jquery qui dépend d'une version externe de Sizzle, plutôt que d'une version intégrée. La même bibliothèque Sizzle peut donc être utilisée par jquery, eccstender ou d'autres scripts.

Semble une bonne idée. Bien que je suppose que cela pourrait nuire à la performance, et je voudrais voir des comparaisons de comparaison avec la version de production jQuery ..

Est-ce que quelqu'un sait si cela a été fait? (fourchette de github?) Ou y a-t-il une bonne raison contre cette approche? .

Répondre

30

Sizzle n'a pas besoin d'être inclus dans la construction de jQuery. Il peut être supprimé ... le code jQuery all references Sizzle., vous pouvez simplement saisir/compiler jQuery vous-même (y compris Sizzle à l'avance) et l'exposer à toute autre bibliothèque (ne pas l'inclure dans la version compilée, juste comme un extern à la fermeture compilateur).


est ici la possibilité de le laisser intégré, mais exposer Sizzle pour une utilisation à l'extérieur:

Si vous connaissez jQuery sera utilisé (dépendance), il suffit d'ajouter ceci après jQuery:

​window.Sizzle = jQuery.find; 

Ceci réexpose Sizzle en tant que propriété que vous pouvez utiliser.


est ici la version manuelle pour retirer Sizzle d'être embarqué:

Dans jQuery (version 1.4.3 link) vous verrez ceci:

/*! 
* Sizzle CSS Selector Engine - v1.0 
* Copyright 2009, The Dojo Foundation 
* Released under the MIT, BSD, and GPL Licenses. 
* More information: http://sizzlejs.com/ 
*/ 
(function(){ 
//... 
//lots of code! 
//... 

// EXPOSE 
jQuery.find = Sizzle; 
jQuery.expr = Sizzle.selectors; 
jQuery.expr[":"] = jQuery.expr.filters; 
jQuery.unique = Sizzle.uniqueSort; 
jQuery.text = Sizzle.getText; 
jQuery.isXMLDoc = Sizzle.isXML; 
jQuery.contains = Sizzle.contains; 

})(); 

Remplacer cette section avec seulement:

(function(){  
// EXPOSE 
jQuery.find = Sizzle; 
jQuery.expr = Sizzle.selectors; 
jQuery.expr[":"] = jQuery.expr.filters; 
jQuery.unique = Sizzle.uniqueSort; 
jQuery.text = Sizzle.getText; 
jQuery.isXMLDoc = Sizzle.isXML; 
jQuery.contains = Sizzle.contains;  
})(); 

Ensuite, tout ce que vous devez faire comprend Sizzleavant jQuery et ça va fonctionner correctement.

Here's a fiddle showing it working, y compris Sizzle directement à partir de GitHub, pas incorporé dans jQuery.

+0

génial! merci beaucoup Nick :) – zack

+0

@zack - bienvenue :) –

+2

Sérieusement grande réponse. – weisjohn

2

Si vous souhaitez utiliser les eCSStender CSS3 Selectors Module avec le Sizzle fourni dans jQuery, vous pouvez le faire:

eCSStender.addMethod('findBySelector',function(selector){ 
    var els = []; 
    jQuery(selector).each(function(){ 
    els.push(this); 
    }); 
    return els; 
}); 

Il peut y avoir un moyen plus facile d'obtenir directement une collection d'élément réel (au lieu d'un faux en utilisant un tableau), mais il est encore tôt et mon cerveau ne fonctionne pas encore tout à fait.

Questions connexes