Utilisez la console JavaScript des navigateurs Concevoir un site dynamique implique de faire appel à JavaScript, langage de plus en plus populaire et puissant. Afin de donner les bons outils aux développeurs web, les navigateurs se sont peu à peu équipés de consoles de développement permettant d'entrer des instructions à la volée, avec bien souvent de l'auto-complétion, de consulter les données en mémoire ou d'explorer les fonctions et variables disponibles. Des commandes plus avancées visent à définir des points d'arrêt et d'inspecter la pile des appels. La console est un outil indispensable lorsque l'on souhaite écrire quelques lignes de JavaScript, ou bien concevoir des scripts plus évolués notamment avec des frameworks tels que jQuery. Accès La console se retrouve bien souvent dans un menu orienté pour les développeurs, à l'aide d'une touche de raccourci, ou dans des extensions spécifiques telles que Firebug pour Firefox. Aperçus Internet Explorer Google Chrome Mozilla Firefox Opera Astuces Fonctions utiles Journal console.log(fruits);
Coder en Javascript dans une console Depuis l’apparition des consoles Javascript, on peut debugger plus facilement des erreurs de scripts, qui à l’époque d’IE6 & co se faisait à coup de alert(). Un chose que je ne trouve pas très répandu, c’est d’utiliser ces consoles pour coder directement, de petit morceaux de code, sans se (re)taper d’ajouter du script inline, ou un fichier juste pour avoir bonne conscience. Avec une console avancée, on peut même éditer des scripts en cours d’exécution ! A quoi ça sert de coder du Javascript dans une console ? Un exemple très simple sera plus parlant : vous voyez un paragraphe de texte et vous vous demandez combien il comporte de caractères. $0 est très simple d’utilisation, et peut être très utile. Utilisation : compter le texte d’un paragraphe Admettons que vous cherchez à compter le nombre de caractères dans une <div>, inspectez là, puis dans votre console entrez-y la ligne suivante: $0.innerHTML.length Et voilà vous avez votre résultat ! Coder plus d’un ligne jQuery.noConflict();
Spec Wiki Utiliser les différents tests d'égalité JavaScript fournit trois opérations permettant de comparer des valeurs : Selon la comparaison qu'on souhaite effectuer, on choisira une de ces opérations. En résumé, l'égalité faible effectuera une conversion des deux éléments à comparer avant d'effectuer la comparaison, l'égalité stricte effectuera la même comparaison mais sans conversion préalable (elle renverra toujours false si les types des deux valeurs comparées sont différents), enfin Object.is() se comportera comme l'égalité stricte sauf pour les valeurs NaN, -0 et +0 : pour Object.is(), -0 et +0 seront différents mais on aura Object.is(NaN, NaN) qui sera true. (Généralement, quand on compare NaN avec NaN en utilisant l'égalité stricte ou l'égalité faible, cela donne false afin de respecter la norme IEEE 754.). On notera que pour ces trois opérations, la comparaison s'effectue sur les valeurs des éléments qu'on compare, aucune de ces opérations ne permet de comparer la structure des paramètres. L'égalité stricte avec ===Edit
Un gros Troll de plus sur Javascript Un commentaire très pertinent de Kontre m’a interpellé dernièrement : si Javascript est si pourri, pourquoi tout le monde s’y intéresse ? TD;DR :L’inertie technique. Il faut bien comprendre que PERSONNE ne s’intéresse à Javascript directement. Quand Ajax est arrivé, des mecs brillants ont rendu le Web plus interactif. Parce que c’était la seule solution dispo. Avant, personne ne s’intéressait à ce truc. Personne n’a réfléchi. L’heure du Web 2.0 a alors sonné, et là les business ont eu besoin de puissance de feu. Google a utilisé massivement les pages dynamiques, et devant le constat des performances misérables de la seule techno qu’il y avait a dispo, il a pondu chrome, et sa VM Javascript ultra performante. C’est quand Google a enfin pu donner des perfs décentes – c’est à dire celles qu’ont d’autres langage depuis une décennie – à Javascript que les gens ont envisagé de l’utiliser sur le serveur. Personne. Ruby est un langage innovant and fun. Python est un langage ergonomique and riche.
Des ressources Javascript pour mieux comprendre et domestiquer le DOM Aujourd'hui, le blog du Webdesign vous propose une liste de ressources Javascript qui vous permettons de mieux vous occuper de votre DOM ! Au programme : Modification, diff, détection de fonctionnalités, et bien d'autres choses ! Bonne découverte Qu'est-ce que le DOM ? Le Document Object Model (ou DOM) est un standard du W3C qui décrit une interface indépendante de tout langage de programmation et de toute plate-forme, permettant à des programmes informatiques et à des scripts d'accéder ou de mettre à jour le contenu, la structure ou le style de documents HTML3 et XML4. Le document peut ensuite être traité et les résultats de ces traitements peuvent être réincorporés dans le document tel qu'il sera présenté. Source : Wikipedia En clair, le DOM est la vision qu'a votre navigateur du code source HTML du site où vous êtes en train de visiter, et c'est à travers la modification de ce DOM que vous pourrez interagir avec votre page en Javascript. Détecter les fonctionnalités disponibles Modernizr
Fun with code Automatisez votre workflow front-end Il était une fois un webmaster Jadis, par des temps lointains datant de l'époque où l'on comptait encore les mégahertz des processeurs, il existait des gens qui concevaient, développaient, et alimentaient des sites Internet. Tout seuls ! Ces personnes possédaient toutes les connaissances nécessaires (et même des fois le matériel sur toute la boucle) pour mettre en place un site web. Équipés des meilleurs outils (Frontpage et Filezilla), ces êtres avaient le pouvoir rare en ces temps nouveaux: on les appelait les Maîtres du Web ! Enfin tout ça, c'était avant. Petit à petit, avec le temps, la pratique, l'évolution d'Internet, les webmasters, surchargés par la masse de travail à réaliser pour s'occuper d'un site, se sont scindés en différents groupes. Certains sont restés sur la conception. De part ma position dans ce milieu, je vais vous parler du poste de développeur, et plus précisément du développeur d'interface. Après j'en aime bien une autre, celle du gardien de foot. Bon courage.