begin process at 2010 03 15 11:45:44
  Trouver un code source :
 
dans
 
Accueil > 

Code

 > 

Divers

 > DOM BUILDER : PROTOTYPE ROCKS !

DOM BUILDER : PROTOTYPE ROCKS !


 Information sur la source

Note :
1 / 10 - par 1 personne
1,00 / 10

  • 1

  • 2

  • 3

  • 4

  • 5

  • 6

  • 7

  • 8

  • 9

  • 10
Catégorie :Divers Classé sous :dom, builder, prototype, class, singleton Niveau :Expert Date de création :06/07/2008 Date de mise à jour :08/07/2008 00:38:51 Vu / téléchargé :3 495 / 100

Auteur : ralecul

Ecrire un message privé
Commentaire sur cette source (9)
Ajouter un commentaire et/ou une note

 Description

Cliquez pour voir la capture en taille normale
Cette petite source contient un builder DOM compatible avec la syntaxe de celui de Prototype.
J'ai réalisé ce builder DOM pour le challenge et parce que celui de Prototype n'est pas encore finalisé.
J'ai effectivement découvert des "bug" avec les attributs camelized sous IE.
Au début je n'avais constaté le bug que pour useMap, puis en creusant un peu j'en ai trouvé beaucoup plus.
-> Au final, j'ai récupéré la liste complète des attributs incriminés dans le code de Mootools.

Le benchmark fournit avec la source est "volontairement" favorable à ma source.
En réalité mon code n'est pas 2x plus rapide que celui de Prototype, je pense juste que c'est leur Event.observe qui n'est pas assez optimisé.
Rien à voir avec le DOM donc... en revanche mon builder corrige quelques bugs de celui de Prototype et ajoute quelques fonctionnalités.


Le fichier myPrototype.js contient plusieurs Singleton :
Element -> Entièrement de moi
Ajax    -> Entièrement de moi (excepté l'évaluation de script)
Event   -> Entièrement de moi
document.viewport -> Version de Prototype 1.6.0.2 + optimisation
Element.Methods   -> Version de Prototype 1.6.0.2 + optimisation

Pour ceux qui ne savent pas ce qu'est un DOM Builder, vous pouvez jetter un coup d'oeil à la source ci-dessous.

Source

  • //Version DOM classique non Cross-Browser à cause des "spécificités" de IE ;-)
  • var input = document.createElement('input');
  • input.setAttribute('name', 'prenom');
  • input.setAttribute('disabled', 'disabled');
  • input.setAttribute('value', 'toto');
  • //Version utilisant un DOM Builder qui masque tous les problèmes de compatibilités
  • var input = new Element('input', {
  • name : 'prenom',
  • disabled : true,
  • value : 'toto'
  • });
//Version DOM classique non Cross-Browser à cause des "spécificités" de IE ;-)
var input = document.createElement('input');
input.setAttribute('name', 'prenom');
input.setAttribute('disabled', 'disabled');
input.setAttribute('value', 'toto');

//Version utilisant un DOM Builder qui masque tous les problèmes de compatibilités
var input = new Element('input', {
  name     : 'prenom',
  disabled : true,
  value    : 'toto'
}); 

 Conclusion

Je n'ai pas eu le temps de tout tester donc il est possible que certains workaround pour IE ne fonctionnent pas...
Donc si certaines choses ne fonctionnent pas, vous êtes priez de me le faire savoir ;-)

 Fichier Zip

Les Membres Club peuvent télécharger directement un fichier contenu dans le zip sans télécharger le zip en entier !

Télécharger le zip


 Historique

06 juillet 2008 00:17:47 :
Je dois mettre une explication alors que je ne fais que modifier la prévisualisation ;-(
08 juillet 2008 00:38:51 :
Ajout des méthodes writeAttribute et readAttribute + correction du bug ('disabled' : false) + gestion de tous(?) les attributs de types booléens + introduction de nouveau(x) bug(s) (?)

 Sources du même auteur

Source avec Zip Source avec une capture CLASSE AJAX : PROTOTYPE ROCKS !
Source avec Zip Source avec une capture AFFICHAGE DE PANORAMA 360° (JAVASCRIPT ORIENTÉ OBJET) - YAJE...
Source avec Zip Source avec une capture RECHERCHE DU PLUS COURT CHEMIN - ALGO DE DIJKSTRA - EN JAVAS...
Source avec Zip Source avec une capture MYFLASHPANO VERSION JAVASCRIPT - UN SYSTÈME DE VISITE VIRTUE...

 Sources de la même categorie

Source avec Zip Source avec une capture SÉQUENCEUR par jdmcreator
Source avec Zip COMPRESSION DE TEXTE CÔTÉ CLIENT EN JS VIA ALGORYTHME LZW par niamor36
Source avec Zip VIRTUAL IPHONE (V.2) par loicseg
Source avec Zip MOOTABLEAU par Miky76
Source avec Zip CALCULER VOTRE IMC par lesnouesremy

 Sources en rapport avec celle ci

Source avec Zip Source avec une capture UID - FRAMEWORK JAVASCRIPT par Kimjoa
Source avec Zip [-CLASS-] -> CARROUSSEL D'IMAGES par TheWeasel47
TRIM, REMOVESPACE, PATTERN MAIL, PATTERN TÉLÉPHONE, PATTERN ... par labotemplates
Source avec Zip CLASS.JS , TEST D'IMPLÉMENTATION DE CLASS EN JAVASCRIPT par Kimjoa
Source avec Zip Source avec une capture CLASSE AJAX : PROTOTYPE ROCKS ! par ralecul

Commentaires et avis

Commentaire de ralecul le 06/07/2008 10:20:30

Une bonne lecture pour la comparaison DOM vs innerHTML :http://www.quirksmode.org/dom/innerhtml.html

Mon benchmark n'utilise pas la méthode cloneNode, il est donc comparable au test "W3C DOM 1" présent sur ce site. En ce qui concerne la version innerHTML, elle est très basique et elle est donc comparable au test "innerHTML 1".

Commentaire de XtremDuke le 07/07/2008 16:35:03

Sympa mais une remarque qui me vient à l'esprit :

Celà fonctionne-t-il ?

var input = new Element('input', {
  name : 'prenom',
  disabled : false,
  value : 'toto'
});

Commentaire de ralecul le 07/07/2008 18:12:16

Il y a effectivement un bug avec mon DOM Builder si tu précises une valeur false pour l'ajout d'attribut de type booléen.
Après cela parait bizarre de spécifier "disabled : false" alors qu'il suffirait de ne pas spécifier de valeur pour disabled.
Mais cela peut être intéressant si l'état de l'attribut booléen est stocké dans une variable.

J'ai écrit une nouvelle version de mon DOM Builder avec les méthodes writeAttribute et readAttribute donc il me sera plus facile de corriger ce bug. Par contre je n'ai pas encore pu re-tester tous les workarounds de IE donc je vais attendre un peu avant de poster les modifications.

Commentaire de XtremDuke le 18/07/2008 12:34:32

Je viens de tomber sur un problème et par curiosité j'ai regardé si celà se produisant avec ta méthode :

var input = new Element('input', {
  type : 'radio',
  name : 'prenom',
  checked : true
});

Sous IE, impossible d'affecter l'attribut 'checked'.

Commentaire de XtremDuke le 18/07/2008 14:47:06

Bon apparement, sous IE, il n'est pas possible de jouer sur l'attribut "checked" tant que l'élément n'est pas inseré.

"...You will noticed I set the checked status on the checkbox. But when IE renders that code the checkbox is unchecked. But when I do the alert it tells me true. What the...? Well, it turns out IE's rendering doesn't care what I do to the checkbox before I insert it into the document. IE only reflects those changes made after the insertion..."

Commentaire de ralecul le 22/07/2008 23:33:05

Encore une "spécificité" de IE, cool ;-)
Je l'avais rencontré il y a longtemps mais je n'utilisais pas encore de DOM builder.
Le seul workaround fonctionnel (de mémoire), créer l'input via innerHTML là il est pris en compte correctement...

<troll>Vivement IE8 et qu'il corrige tout ça...</troll>

Commentaire de XtremDuke le 23/07/2008 09:53:21

"Vivement IE8 et qu'il corrige tout ça..."

>> je pencherai plutôt pour la version IE12 en 2038. ^^

Bon ok, j'arrête mes sarcasmes...

Commentaire de kazma le 11/11/2009 21:17:36 1/10

vue que ta source et plus ou moins dans la meme vision que la mienne je pense que tu merite la meme note

Commentaire de ralecul le 12/11/2009 21:27:04

Kazma : Quel dommage ! Si tu avais pris la peine de regarder ma source je suis sur que tu aurais appris des choses...

 Ajouter un commentaire


Discussions en rapport avec ce code source dans le forum

modif CLASS et attribut en dynamique ? [ par McPeter ] Salutquelqu'un aurait une idée pour attribuer un valign="middle" en dynamique sous JavaScriptje sais le faire pour align="center" mais je sèche pour l Aidez moi ... Plizzzz ... comment modifier un class ...? [ par GuilleW ] j'ai des fichier class que j'arrive a ouvrir grace a Decafé (decompilateur .class qui sauvegarde en .java) et je les recompile avec jk2jk22kjrks un tr [DOM MOZILLA]urgent [ par dionysos6868 ] bonsoirvoila j'ai cadocument.getElementById("cadremenu").style.top=posYmenu+24;cela marche tres bien sou IE mais pas sous MOZILLAQuelqu'un pourrais m' Class Defilement auto d'images avec animation [ par MeTh ] Je suis sur d'etre pret du but et je suis &#233;galement convaincu que ce script peut servir &#224; bcp de personne. Ceci ma premi&#232;re tentative probleme mozilla [ par javert ] salut, je vient de faire un petit calendrier en js, mais il ne fonctionne malheureusement pas sous mozilla. impossible de lui faire comprendre la li Aidez-moi s'il vous plait [ par pandzobo ] Bonjour,J'ai t&#233;l&#233;charg&#233; ici le script que j'ai utilis&#233; dans le fichier DHTML inclus ci-apr&#232;s pour un menu d&#233;roulant. Mai probleme triangle de pascal [ par tofismagic ] 1 - D&#233;terminer l&#8217;algorithme permettant de calculer les coefficients du triangle de Pascal<?xml:namespace prefix Aide pour Newsletter [ par Nownow ] O&#249; est le probl&#232;me ?&lt;html&gt; &lt;head&gt;&lt;meta name="GENERATOR" content="Microsoft FrontPage 5.0"&gt;&lt;meta name="ProgId" content=" Récupérer toutes les class d'un élément [ par flexx ] Salut J'attribut &#224; un div plusieurs classes ( &lt;div class="toto tata"&gt; ) Comment, en javascript, je peux r&#233;cup&#233;rer toutes les cla Class CSS dans code javascript [ par micfont999 ] Salut &#224; tous, voila j'ai un piti probl&#232;me que je n'arrive pas &#224; r&#233;soudre depuis ce matin..Peut &#234;tre tr&#232;s simple mais pas


Nos sponsors


Sondage...

CalendriCode

Mars 2010
LMMJVSD
1234567
891011121314
15161718192021
22232425262728
293031    

Consulter la suite du CalendriCode

Photothèque

 
Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), Merci à Vincent pour ses précieux conseils.
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés

Google Coop CodeS-SourceS Google Coop CodeS-SourceS
Temps d'éxécution de la page : 1,544 sec (4)

Nous contacter | Annoncer sur CodeS-SourceS | Mentions légales