Pas beaucoup à dire sur cette technique mal maîtrisée, si ce n’est :
- Utilisez un réseau de distribution de contenu (Content Delivery Network), et tant qu’à faire, prenez directement celui de jQuery (en prenant soin de contrôler l’intégrité des ressources).
- Ajoutez une copie en locale au cas où vous n’avez pas d’accès Internet ou si le contenu n’est pas distribué à l’utilisateur.
Donc :
<script
src="https://code.jquery.com/jquery-3.2.1.min.js"
integrity="sha384-xBuQ/xzmlsLoJpyjoggmTEz8OWUFM0/RC5BsqQBDX2v5cMvDHcMakNTNrHIW2I5f"
crossorigin="anonymous"
async="">
</script>
<script>window.jQuery || document.write('<script src="../jquery-3.2.1.min.js" integrity="sha384-xBuQ/xzmlsLoJpyjoggmTEz8OWUFM0/RC5BsqQBDX2v5cMvDHcMakNTNrHIW2I5f></script>')</script>
À noter que document.write
est à éviter et à remplacer, mais que c’est dans ce cas la seule façon de charger la copie de secours de façon synchone. En effet, un
<script>
(function(){ if(!window.jQuery) {
var s = document.createElement("script"),
s0 = document.getElementsByTagName('script')[0];
s.src = "../jquery-3.2.1.min.js";
s.async = false;
s0.parentNode.insertBefore(s, s0);
}})();
</script>
chargera jquery
en tout dernier, ce qui n’est sans doute pas ce que vous souhaitez (car vous chargez cette bibliothèque pour l’employer dans un autre script, non?).
Jplayer, fancyBox, SyntaxHighlighter, Lazy Load et le pop-up emploient cette bibliothèque.
Si vous désirez une bibliothèque bien spécifique mais que vous aimeriez qu’elle soit disponible depuis un réseau de distribution de contenu, commencez par jeter un œil à CDNJS, un service de Cloudflare.
Afficher la taille d’un fichier à télécharger
Code modifié depuis celui trouvé à cette adresse.
function hdrDetails(i, elm, cl) {
cl = cl/1024;
var sz = cl>1024?"Mio":"Kio";
cl = cl>1024?cl/1024:cl;
{if ( $(elm).eq(i).attr('class') != "fancybox-thumbs"){
/* On n’applique pas cette règle aux liens ayant pour classe fancybox-thumbs,
parce que ces ressources ne sont pas destinées au téléchargement. */
var origTitle = $(elm).eq(i).attr('title');
var nom = $(elm).eq(i).attr('href').split('/').pop().toLowerCase();
{if (origTitle == undefined ) {
$(elm).eq(i).attr('title', "Téléchargez "+nom+" ("+cl.toFixed(2)+" "+sz+").");}
else
{ $(elm).eq(i).attr('title', origTitle+" ("+nom+", "+cl.toFixed(2)+" "+sz+")");;}};
};
}
;}
$(function() {
var elm="a[href$='.pdf'],
"+"a[href$='.png'],
"+"a[href$='.jpeg'],
"+"a[href$='.zip'],
"+"a[href$='.jpg'],
"+"a[href$='.mp3'],
"+"a[href$='.ogg'],
"+"a[href$='.css'],
"+"a[href$='.less'],
"+"a[href$='.txt'],
"+"a[href$='.flac'],
"+"a[href$='.wav'],
"+"a[href$='.webm'],
"+"a[href$='.ogv'],
"+"a[href$='.mp4']",
"+"a[href$='.mov'],
"+"a[href$='.avi']";
$(elm).each(function(i, e) {if (e.hostname && e.hostname == location.hostname ) {
$.ajax({type: "HEAD",
url: $(this).attr("href"),
complete: function(xhr, textStatus) {
var cl=xhr.getResponseHeader("content-length");
if(textStatus=="success") {
var cl=xhr.getResponseHeader("content-length");
hdrDetails(i, elm, cl);}}});}});}
);
Ce script est employé pour l’autoindex, car il n’est pas possible d’afficher cette information à l’aide du php
.