Bonjour à tous,
Je me trouve face a un dilem d'optimisation:
Tout mon site utilise Ajax pour fonctionner, et comme le veux les bonnes pratiques, je place le javascript dans un fichier a part qui est inclut sur toutes les pages.
Seulement voila, si la div qui doit reçoit n'est pas présente, que ce passe t'il ? jQuery charge t il la page quand même (et donc fait travailler le serveur) ou bien ignore t'il la requête ?
J'utilise load(), pour info.
Merci de votre aide
Je ne comprends pas… Peux-tu préciser s'il te plaît ? Avec éventuellement du code en guise d'exemple.
Sephi-Chan
Bha imaginons:
ce code, placer sur toutes les pages:
Code JAVASCRIPT
<script type="text/javascript">
$(div.inventaire).load("inventaire.php");
</script>
Avec bien sur, le réceptacle
Code HTML
<div class="inventaire"></div>
Mais seulement sur la page "fiche.php".
Que va t'il ce passer sur les autres page sachant que la div n'y figure pas ? jQuery va charger la page mais ne l'affichera pas ? ou va t'il ignorer la requête (et donc ne pas surcharger le serveur) ?
Je pense qu'il appelle quand même la page, mais qu'il n'en fait rien puisqu'il ne sait pas où le mettre.
Dans le doute, essaye : incrémente une variable de session dans le script inventaire.php, ainsi tu sauras bien si la page a été appelée.
Dans tous les cas, tu peux faire :
Code JAVASCRIPT
var inventaire = $("div.inventaire");
if(inventaire.lenght == 1){
inventaire.load("inventaire.php");
}
Sephi-Chan
Merci de ton aide
.
J'ai finalement opté pour une autre solution, plus simple au final.
Il faudra un jour que je vérifie ce que fait jQuery dans un cas comme sa, on pourrait supposé qu'il cherche d'abord si le réceptacle existe avant de faire les actions qui lui sont associé.
Je ferais le teste quand j'aurais le temps
Oui mais -sans vouloir partir sur le débat- Mootools à malheureusement une librarie de scripts tres minime par rapport à celle de JQuery sur le net...
Mais je préfere Moo car mes 3 scripts préférés sont codés avec
J'ai fait tout mon site avec jQuery, j'ai chier pour comprendre son fonctionnement. Pas vraiment envie de tout reprendre a 0...
Citation :Il a moins de scripts à dispositions, mais finalement ça ne me dérange pas, je programme ce dont j'ai besoin.
J'ai codé tout mes scripts jQuery, même ceux qui existait déjà sur le net. Pour apprendre et comprendre ce que je fais.
jQuery fait la liste de tous les éléments correspondant au sélecteur donné, puis applique a chacun d'entre eux la fonction load(). Donc si l'élément n'existe pas, la fonction load() n'est pas déclenchée.
Vérifie tout de même (avec firebug, par exemple, pour voir si la requête xhr est déclenchée), mais normalement c'est ça.
[edit] Après vérification du code, Sephi-chan a raison: pour des raisons de performance, jQuery lance d'abord la requête puis applique ensuite le résultats aux objets sélectionnés. Ca ne génerera donc pas d'erreur, mais la requête sera quand même lancée. Code source complet de la fonction:
Code JAVASCRIPT
load: function( url, params, callback ) {
if ( typeof url !== "string" )
return this._load( url );
var off = url.indexOf(" ");
if ( off >= 0 ) {
var selector = url.slice(off, url.length);
url = url.slice(0, off);
}
// Default to a GET request
var type = "GET";
// If the second parameter was provided
if ( params )
// If it's a function
if ( jQuery.isFunction( params ) ) {
// We assume that it's the callback
callback = params;
params = null;
// Otherwise, build a param string
} else if( typeof params === "object" ) {
params = jQuery.param( params );
type = "POST";
}
var self = this;
// Request the remote document
jQuery.ajax({
url: url,
type: type,
dataType: "html",
data: params,
complete: function(res, status){
// If successful, inject the HTML into all the matched elements
if ( status == "success" || status == "notmodified" )
// See if a selector was specified
self.html( selector ?
// Create a dummy div to hold the results
jQuery("<div/>")
// inject the contents of the document in, removing the scripts
// to avoid any 'Permission Denied' errors in IE
.append(res.responseText.replace(/<script(.|\s)*?\/script>/g, ""))
// Locate the specified elements
.find(selector) :
// If not, just inject the full result
res.responseText );
if( callback )
self.each( callback, [res.responseText, status, res] );
}
});
return this;
}
Ta commande n'aurait pas bloqué ta page.
En fait quand tu utilises un sélecteur dans jQuery, il retourne un tableau d'élement correspondant au sélecteur et il exécute ensuite les commandes sur ce tableau en bouclant sur chaque élément retourné.
Si le sélecteur ne retourne rien, tu auras comme même un tableau en retour mais vide.
C'est ce qui évite de planter sur un sélection ne ramenant rien et ça évite de tester l'existence des éléments avant.
Mais vu que la requête est tout de même exécutée, si la page en question a une action spéciale (du style insérer une valeur en db), alors il faut tester.