JS : Reference à une propriété d'un element

Marsh Posté le 19-07-2006 à 23:37:19

:hello: all !

Je me posais une question mais vraiment conne

Nous somme tous d'accord qu'en JS on peut faire une référence à un élément ex :

Code :

<div id="toto" style="font-size:20px; width:40px">
var titi = document.getElementById("toto" );

Dans mon cas maintenant j'ai titi qui est une reference au div avec l'id toto
et je peux alors accéder à toute les propriétés et méthode de cet élément.

ce que je me demandais, c'est si on peut faire une reference à une propriété sur un élément [:petrus75]
ex:

var reftiticlass = titi.className;

je voudrais que reftiticlass soit une reference à titi.className, dans ce cas quand je modifie reftiticlass, ca impute les changements sur titi.className.

Mais je ne vois pas comment faire, ou peut être est-ce impossible à faire, il y a de fortes chances
Mais ça serait top si on pouvais passer les variables par reference comme des pointeurs en C ou byref en vb

Ceci est juste une question a la con qui tournait dans ma tête ce soir [:petrus75]

Message édité par gatsu35 le 20-07-2006 à 08:40:21

Reply

Marsh Posté le 19-07-2006 à 23:37:19

Reply

Marsh Posté le 20-07-2006 à 10:31:49

http://www.snook.ca/archives/000503.php

ça a l'air d'être le cas pour les objets non, ou alors c'est encore une weberie à la con à laquelle je comprends rien [:petrus dei]

Citation :

Passing in an object, however, passes it in by reference. In this case, any property of that object is accessible within the function.

Message cité 1 fois

---------------
J'ai un string dans l'array (Paris Hilton)

Reply

Marsh Posté le 20-07-2006 à 11:42:37

Harkonnen a écrit :

http://www.snook.ca/archives/000503.php

ça a l'air d'être le cas pour les objets non, ou alors c'est encore une weberie à la con à laquelle je comprends rien [:petrus dei]

Citation :

Passing in an object, however, passes it in by reference. In this case, any property of that object is accessible within the function.

C'est ce que j'ai expliqué au début, j'entend par élément, objet [:moule_bite]

Reply

Marsh Posté le 20-07-2006 à 11:55:20

ben alors, les objets sont bien passés par référence, skoi le pb ? [:el g]

---------------
J'ai un string dans l'array (Paris Hilton)

Reply

Marsh Posté le 20-07-2006 à 12:18:48

ce sont pas les objet que je veux passer en reference mais les attribut de ces objet

var foo = obj.className

foo devient une string et non une reference à className
et je voudrais que foo devienne une reference à className

enfin je dis je voudrait, mais j'en ai pas forcément besoin [:petrus75]

Reply

Marsh Posté le 20-07-2006 à 12:26:25

ben utilise un vrai langage [:jagstang]

---------------
J'ai un string dans l'array (Paris Hilton)

Reply

Marsh Posté le 20-07-2006 à 13:47:11

quand Harkonnen parle d'objet, il parle d'objet que tu aurais créer pas de ceux que tu peux "récupérer" comme par exemple un DOMnode. C'est la seule façon de faire des passages par référence.
Du coup tu peux te créer un objet propRef pour jouer avec!
Un truc dans le genre:

Code :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" >
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<title>Exemple</title>
<script type="text/javascript">
window.onload = function (e){
function propRef(e, p){
this.element = e;
this.prop = p;
}
propRef.prototype.setValue = function (value){
this.element.setAttribute(this.prop, value);
}
propRef.prototype.toString = function(){
return this.element.getAttribute(this.prop);
}
var pr = new propRef(document.getElementById('p'), 'class');
pr.setValue('piut');
alert('pr:'+pr+' -- element: '+document.getElementById('p').getAttribute('class'));
}
</script>
</head>
<body>
<p id="p" class="pouet">paragraphe</p>
</body>
</html>

Reply

Marsh Posté le 20-07-2006 à 16:00:42

elle te plait pas ma solution ???

Reply

Marsh Posté le 20-07-2006 à 17:28:26

Heu elle est bien, mais moi j'aurai préféré avoir un operateur malheureusement ca n'existe pas

tiens sinon, c'est pas plus simple ??

Code :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" >
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<title>Exemple</title>
<script type="text/javascript">
function propRef(e, p){
this.element = e;
this.prop = p;
this.setValue = function (value){
this.element.setAttribute(this.prop, value);
}
this.toString = function(){
return this.element.getAttribute(this.prop);
}
}
window.onload = function (){
var pr = new propRef(document.getElementById('p'), 'class');
pr.setValue('piut');
alert('pr:'+pr+' -- element: '+document.getElementById('p').getAttribute('class'));
}
</script>
</head>
<body>
<p id="p" class="pouet">paragraphe</p>
</body>
</html>

Message cité 1 fois

Reply

Marsh Posté le 20-07-2006 à 17:35:08

:heink:

className c'est pas un objet hein... donc tu auras forcément une valeur et non pas une référence dans ta variable.

Message cité 2 fois

Reply

Marsh Posté le 20-07-2006 à 17:35:08

Reply

Marsh Posté le 20-07-2006 à 17:48:59

gatsu35 a écrit :

Heu elle est bien, mais moi j'aurai préféré avoir un operateur malheureusement ca n'existe pas

Fais une surcharge

gatsu35 a écrit :

tiens sinon, c'est pas plus simple ??

Code :

...

Si j'ai tout écrit à la va vite, c'est effectivement miex

Arjuna a écrit :

:heink:
className c'est pas un objet hein... donc tu auras forcément une valeur et non pas une référence dans ta variable.

Oui c'était bien sa problèmatique, il cherchait donc un contournement!

Message cité 1 fois

Reply

Marsh Posté le 20-07-2006 à 18:05:18

Arjuna a écrit :

:heink:

className c'est pas un objet hein... donc tu auras forcément une valeur et non pas une référence dans ta variable.

Nan pas possible [:moule_bite]

Reply

Marsh Posté le 20-07-2006 à 18:06:24

anapajari a écrit :

Fais une surcharge

de quelle manière ?
on peut surcharger un operateur en JS ?

Reply

Marsh Posté le 20-07-2006 à 18:25:19

nan nan on peut pas , je deconnais ...
je crois néanmoins que c'est dans le draft du js2.0

Message cité 1 fois

Reply

Marsh Posté le 20-07-2006 à 18:29:47

anapajari a écrit :

nan nan on peut pas , je deconnais ...
je crois néanmoins que c'est dans le draft du js2.0

:love:

Reply

Marsh Posté le 20-07-2006 à 20:04:55

Code :

<html>
<head>
<title>Test de référence en JS</title>
<script type="text/javascript">
function init()
{
handle1 = getHandle("txtField", "value" );
handle2 = getHandle("txtField", null);
handle3 = getHandle("linkField", "style" );
document.getElementById("txtField" ).onkeyup = test1;
document.getElementById("txtField" ).onclick = test2;
document.getElementById("linkField" ).onclick = test3;
}
function test1()
{
document.getElementById("txtHandle1" ).value = handle1;
}
function test2()
{
document.getElementById("txtHandle2" ).value = handle2;
}
function test3()
{
if (handle3.color == 'blue')
handle3.color = 'red';
else
handle3.color = 'blue';
return false;
}
function getHandle(objName, propName)
{
if (propName == null)
{
return document.getElementById(objName);
}
else
{
if (typeof(document.getElementById(objName)[propName]) == "object" )
{
return document.getElementById(objName)[propName];
}
else
{
if (typeof(document.getElementById(objName).attributes[propName]) == "object" )
{
return new handleObject(document.getElementById(objName).attributes[propName]);
}
else
{
return new handleObject2(document.getElementById(objName), propName);
}
}
}
}
function handleObject(obj)
{
this.obj = obj;
this.toString = function (){return this.obj.value;}
}
function handleObject2(obj, propName)
{
this.obj = obj;
this.toString = function (){return eval("obj." + propName);}
}
var handle1 = new Object();
var handle2 = new Object();
var handle3 = new Object();
window.onload = init;
</script>
</head>
<body>
<form action="#">
<input type="text" id="txtField"/>
<input type="text" id="txtHandle1"/>
<input type="text" id="txtHandle2"/>
<hr/>
<a href="#" id="linkField" style="color: blue;">click me</a>
<hr/>
</form>
</body>
</html>

En porcinant un peu le code, il passe sous Moz aussi maintenant.
Seul le cas où on recherche une propriété de type valeur est émulée sous Moz, car sous IE y'a moyen d'interroger DOM qui est dynamiquement mis à jour contrairement à chez Moz.

Par contre, y'a une limitation pour ce type de propriétés : on peut lire les mises à jour, mais si on écrit, ça shoote le handle.
Y'a malheureusement pas de "get" et "set" sur les objets en JS...

Message édité par MagicBuzz le 20-07-2006 à 21:05:40

Reply

JS : Reference à une propriété d'un element

Sujets relatifs:

Leave a Replay