Résumé de l'apprentissage JavaScript - Compétences d'utilisation de js_javascript

1 Que faire si le navigateur ne prend pas en charge JavaScript ?

a. Pourquoi le navigateur ne le prend-il pas en charge ? La plupart des navigateurs ont la fonction de désactiver les scripts, comme Chrome.

b. Lorsque js est désactivé, assurez-vous que la page Web peut toujours remplir ses fonctions principales (besoins clés de l'utilisateur)

Exemple : Pour ouvrir un lien dans une nouvelle fenêtre, vous pouvez utiliser la méthode open() du BOM

 function popUp(winURL) {
   window.open(winURL, "popup", "width=,height=");
 }

L'implémentation js spécifique a les solutions suivantes :

Option 1 : Utiliser le pseudo-protocole javascript :

<a href="javascript:popUp('http://www.example.com');return false;">Example</a>

Option 2 : Utiliser la fonction de gestion des événements intégrée :

<a href="#" onclick="popUp('http://www.example.com');return false;"></a>

Pour les deux solutions d'implémentation ci-dessus, lorsque js est désactivé, l'exigence "d'ouvrir le lien dans une nouvelle fenêtre" ne peut pas être remplie. Par conséquent, vous ne pouvez pas abuser de js pour simplement utiliser js. Le plan de mise en œuvre suivant réserve une retraite pour js, ce qu'on appelle la dégradation en douceur (laisser une retraite après l'interdiction de js)

Option 3 : Dégradation en douceur35c839e420e4ea4813a213c2a07d91a7

2 Comment séparer la structure et le contenu des pages web des actions des scripts JavaScript ? Pourquoi se séparer ?

a. Il y a une division claire du travail, chacun fait ce qu'il veut, et puis il y a la collaboration :

Structure et contenu des pages Web - réalisés par HTML, style de page Web - réalisés par CSS, comportement des pages Web - réalisés par JavaScript

b. Séparer le code js est en fait très simple. Le code js ne nécessite pas que l'événement soit traité en html. Vous pouvez ajouter un événement à un élément du document html dans un fichier js externe. Par exemple :

 window.onload = paperLinks
   function paperLinks() {
   var links = document.getElementsByTagName("a");
     for (var i=; i<links.length;i++){
     if (links[i].getAttribute == "popup") {
       linnks[i].onclick = function() {
         popUp(this.getAttribute("href"));
         return false;
       }
     }
    }
  }

3 Problèmes de compatibilité du navigateur

L'ancien et le nouveau doivent être compatibles, une attention particulière étant accordée aux anciens, c'est-à-dire à la rétrocompatibilité. Différents navigateurs ont différents niveaux de prise en charge de js, tels que

document.getElementsByClassName(classname) IE6 ne le prend pas en charge. Vous pouvez vérifier les problèmes de compatibilité en ajoutant une instruction de contrôle : if(!document.getElementsByClassName) return false;

4 Considérations sur les performances

Pourquoi devrions-nous considérer les performances d’exécution des scripts ? Les performances sont toujours un problème à prendre en compte, il s'agit de savoir si la page Web que vous écrivez peut se charger correctement.

Comment s'assurer que les performances d'exécution du script sont optimales ?

a. Accédez le moins possible au DOM et utilisez moins de balises, par exemple : utilisez moins de parcours de boucle

 var links = document.getElementsByTagName("a");
   if (links.length > ) {
     for (var i=; i<links.length; i++) {
     //......
   }
 }

Les performances sont meilleures que le code ci-dessous

 if (document.getElementsByTagName("a").length > ) {
   var links = document.getElementsByTagName("a");
   for (var i=; i<links.length; i++) {
   //......
   }
 }

b. Fusionner les scripts (code js) pour réduire le nombre de requêtes envoyées au chargement de la page ; placez la balise 3f1c4e4b6b16bbbd69b2ee476dc4f83a à la fin du document, avant la fin de 36cc49f0c466276486e50c850b7e4956. la page se charge plus rapidement. Cela n'affecte pas le chargement de js.

c. Compressez le script, supprimez les espaces et commentaires inutiles dans le code js, et simplifiez même les noms de variables. Deux versions de js peuvent être préparées : l'une est une version de travail pour modifier le code et les commentaires, et l'autre est une version simplifiée pour la publication.

objet javascript

Le contenu ci-dessus est l'introduction de cet article aux compétences d'utilisation de js résumées dans l'apprentissage du javascript. J'espère qu'il vous plaira.