Hello Javascripteuses et teurs...
Nombre d'entre nous se pose la question de savoir quelles sont les propriétés ou les attributs d'un objet présent sur la page que l'on écrit fiévreusement, voire plus si affinité... Javascript , introduit il faut le rappeler par NetScape, nous offre une solution simple...la fameuse Boucle ...
for( var i in Objet)
Cette boucle peut rendre de grand service ou simplement aiguiser votre curiosité.
for( var i
in Objet)
// la boucle
Afficher( Objet[i]); // l'instruction
Mise en oeuvre élémentaire...
On glisse le script entre les balises <body>...</body> de la façon suivante...
Exemple :<html>
<head>
</head>
<body>
<script type="text/javascript"
var Objet = navigator;
for( var i in Objet)
document.write( "<B>"+ i + " = </B>" + Objet[i] +"<BR>");
</script>
</body>
</html>
Résultat :
Avec cet exemple en fin de document apparaîtront les propriétés de votre navigateur ainsi que les valeurs de celles ci.
Essayez de remplacer navigator par this pour voir...
Vous vous rendrez vite compte que les propriétés misent à disposition par les différents navigateurs ne sont pas toutes les mêmes...
Autre mise en oeuvre...
On crée une fonction, par exemple ObjShowInfo( obj_), que l'on intègre...
soit dans le document......entre les balises <script>...</script> celles ci étant entre les balises <head>...</head> comme suit...
<html>
<head>
<script type="text/javascript">
//-------------------------
function ObjShowInfo( obj_){
...corps de la fonction Voir plus loin...
}
</script>
</head>
<body>
..BlaBla...ma page
</body>
</html>
soit dans un fichier .js...
#1 - Création d'un fichier objinfo.js par exemple...( Non traitée ICI ...)
#2 - Référencement de celui ci, dans la page, de la façon suivante...
<html>
<head>
<script src="objinfo.js" type="text/javascript">
</head>
<body>
..BlaBla...ma page
</body>
</html>
Appel de la fonction...
, sinon à quoi ça sert......pour ce faire on va utiliser l'événement onclick="" lié aux objets qui sont placés dans votre page...
Exemple :<div id="DIV_0" onclick="ObjShowInfo( this);">Voir Info</div>
ou encore...<div id="DIV_0" onclick="ObjShowInfo( this.style);">Voir Info style</div>
...la c'est à vous de jouer....
La fonction...
...la fonction peut ressembler à ce qui suit...
//-------------------------
function ObjShowInfo( obj_){
var Win;
var html;
var L = 400; // Largeur Fenêtre
var H = 400; // Hauteur Fenêtre
var X = (screen.width -L) /2; // Centrage Horizontal
var Y = (screen.height -H) /2; // Centrage Vertical
var Pos = "left="+X+",top="+Y+",width="+L+",height="+H +",";
var Opt = "scrollbars=yes, resizable=yes" ;
//-- Création de la Fenêtre
Win = window.open("","", Pos +Opt);
//-- Balises d'entête
html = '<html><head>';
//-- Un peu de Style pour plus de clarté
html += '<STYLE TYPE="text/css">';
html += 'body{font-size:13px;font-family:Verdana;}';
html += 'B {color:#0000ff;}';
html += 'PRE {font-size:11px;font-family:Verdana;margin:0px 10px;}';
html += '</STYLE></head>';
//-- Le corps du document avec fermeture si perte du Focus
html += '<body OnBlur="javascript:window.close();">';
//-- Nom de l'Objet
html += '<H1>'+ eval(obj_) +'</H1>';
Win.document.write(html);
//-- La fameuse boucle
for (var i in obj_){
html = '<B>' +i +' =</B>'; // La propriété
html+= '<PRE>' +obj_[i] +'<BR></PRE>'; // et sa valeur
Win.document.write(html); // on écrit
}
//-- Balises fin document
Win.document.write('-- End FILE ---</body></html>');
//-- Fermeture document
Win.document.close();
//-- Focus sur la fenêtre
Win.focus();
}
Nota:
le résultat n'est pas présenté dans l'ordre alphabétique, mais la je n'y suis pour rien..Conclusion...
Si vous ne possédez pas la documentation qui va bien, ou si vous voulez connaître une valeur, cela devrait vous aider au développement de vos pages...
Alors
Bonne PROG...;0)