Comment refactoriser ces tags de script?

J'ai les balises de script suivantes dans le <head> de sorte qu'elles n'indiquent aucune erreur de sécurité lors d'un va-et-vient entre les pages SSL et non-SSL. Mais ça a l'air poilu.Comment refactoriser ces tags de script?

De toute façon je peux les combiner ou réduire une partie du code?

<script type="text/javascript">document.write(["\<script src='",("https:" == document.location.protocol) ? "https://" : "http://","ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js' type='text/javascript'>\<\/script>"].join(''));</script> 
<script type="text/javascript">document.write(["\<script src='",("https:" == document.location.protocol) ? "https://" : "http://","html5shiv.googlecode.com/svn/trunk/html5.js' type='text/javascript'>\<\/script>"].join(''));</script> 
<script type="text/javascript">document.write(["\<script src='",("https:" == document.location.protocol) ? "https://" : "http://","use.typekit.com/12345.js' type='text/javascript'>\<\/script>"].join(''));</script>

Source

2010-05-10 Shpigford

Tous les navigateurs modernes comprendront le de référence relative le format URI, qui fonctionnera automatiquement pour les deux http et httpsURI scheme names:

<script src="//example.com/path/script.js"></script>

Pour en savoir plus:

Source

2010-05-10 20:04:05

<script type="text/javascript"> 
    // Create a closure for our loadScript-function 
    var loadScript = (function() { 
     var headTag = document.getElementsByTagName('head')[0], 
      scriptTagTemplate = document.createElement('script'), 
      addEventListener = function (type, element, listener) { 
       if(element.addEventListener) { 
       element.addEventListener(type, listener); 
       return true; 
       } 
       else if (element.attachEvent) { 
       element.attachEvent('on'+type, listener); 
       return true; 
       } 
       return false; 
      }; 
     scriptTagTemplate.type = 'text/javascript'; 

     // This function clones the script template element and appends it to head 
     // It takes an uri on the form www.example.com/path, and an optional 
     // callback to invoke when the resource is loaded. 
     return function (uri, callback) { 
      var scriptTag = scriptTagTemplate.cloneNode(true); 
      if (callback) { 
       addEventListener('load', scriptTag, callback); 
      } 
      headTag.appendChild(scriptTag); 
      scriptTag.src = ['//', uri].join(''); 
     } 
    }()); 
</script>

Maintenant, vous pouvez utiliser la fonction comme ceci:

<script> 
     loadScript('ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js'); 
     loadScript('html5shiv.googlecode.com/svn/trunk/html5.js'); 
     loadScript('use.typekit.com/12345.js'); 
</script>

La force de cette solution est que vous évitez d'utiliser document.write qui est sujette à l'erreur et le blocage. Vous avez également l'option d'invoquer un rappel une fois le script chargé.

Source

2010-05-10 20:38:17 PatrikAkerstrand

Comment refactoriser ces tags de script?

Répondre

Questions connexes