OVH Cloud OVH Cloud

javascript et innerHTML

35 réponses
Avatar
yt.trash
j'ai une page d'essai qui me sert essentiellement à tester des svg.

par un js je cherche à changer l'innerHTML d'une div.

je fabrique l'innerHTML à partir d'un index représentant un des n svg à
visualiser :

function getInnerHTML(idx)
{
if (idx < 10) idx = "0"+idx;
html="<object
data='http://yvon-thoraval.com/SVG/essais/leafnode_lock_opening_svg/leaf
node_lock_opening_"+idx+".svg' type='image/svg+xml' ";
html+="width='600' height='600'>";
html+="<embed
src='http://yvon-thoraval.com/SVG/essais/leafnode_lock_opening_svg/leafn
ode_lock_opening_"+idx+".svg' type='image/svg+xml' ";
html+="width='600' height='600' ";
html+="pluginspage='http://www.adobe.com/svg/viewer/install/' />";
html+="</object>";
return html;
}


j'ai mis l'adresse absolue dès fois que...

mais ça ne marche pas plus, le reste du script :

function findDOM(o_id)
{
if (document.getElementById)
{
return (document.getElementById(o_id));
}
if (document.all)
{
return (document.all[o_id]);
}
}
function openLock()
{
o=findDOM("svg_id");
if(o)
{
o.innerHTML=getInnerHTML(16);
alert(o.innerHTML);
}
}

window.onload=openLock;

ça n'a rien de spécial.

et pourtant ça ne marche pas :[

ce qui se passe :

je vérifie que le innerHTML de la div d'id = svg_id a bien changé par
alert(o.innerHTML);

mais, à l'écran, si je vois bien que le innerHTML et rechargé, il reste
cependant que ça ne s'affiche pas.

la page :

<http://yvon-thoraval.com/SVG/essais/leafnode_lock_opening_svg/leafnode_
lock_opening.html>

le premier svg par défaut :

<http://yvon-thoraval.com/SVG/essais/leafnode_lock_opening_svg/leafnode_
lock_opening_08.svg>

le second, après onload :

<http://yvon-thoraval.com/SVG/essais/leafnode_lock_opening_svg/leafnode_
lock_opening_16.svg>


je ne pige pas ce qui se passe d'autant que la console js (je teste avec
firefox 2 version fr)...

si qq'un a une idée...

quan au moins un basculement de *08.svg vers *16.svg fonctionnera, je
pense ajouter un timer afin de vsualiser les 17 svg du dossier...
--
Une Bévue

10 réponses

1 2 3 4
Avatar
ASM
j'ai une page d'essai qui me sert essentiellement à tester des svg.

par un js je cherche à changer l'innerHTML d'une div.


Assez mauvaise idée !

Mieux vaudrait passer par la création d'élements
var truc = document.createElement('object');
etc ...

Pouis de faire l'échange des objets

idx.parentNode.replaceChild(truc, idx);

--
ASM

Avatar
ASM
j'ai une page d'essai qui me sert essentiellement à tester des svg.

par un js je cherche à changer l'innerHTML d'une div.


Assez mauvaise idée !


rappel :
http://stephane.moriaux.perso.orange.fr/truc/innerHTML_danger


Avatar
yt.trash
ASM wrote:

Assez mauvaise idée !


rappel :
http://stephane.moriaux.perso.orange.fr/truc/innerHTML_danger


c'est buggé alors ?

bon je vais tester par clonage mais j'avais essayé autre chose, sans la
div avec object et embed à l'intérieur et je changeait le data de object
et le src de embed, que dalle à l'écran.

bon, j'essaie ça et reposte après essais...
--
Une Bévue


Avatar
ASM
ASM wrote:

Assez mauvaise idée !
rappel :

http://stephane.moriaux.perso.orange.fr/truc/innerHTML_danger


c'est buggé alors ?


Non c'est interprété différemment suivant IE ou non ...

En gros innerHTML ne devrait n'être réservé qu'au texte contenu entre
balises

L'autre "bug" de innerHTML est qu'il ne retient pas les events glissés
dans les balise (si non IE)

autre test :
http://members.aol.com/_ht_a/hikksnotathome/loadJSFile/index.html



Avatar
ASM
j'ai une page d'essai qui me sert essentiellement à tester des svg.

par un js je cherche à changer l'innerHTML d'une div.


ben ...
http://stephane.moriaux.perso.wanadoo.fr/truc/yt/leaf_1.html

OK pour mon FF et mon Opera (mais pas Safari)

Voir IE Win ?

Avatar
yt.trash
ASM wrote:


Non c'est interprété différemment suivant IE ou non ...

En gros innerHTML ne devrait n'être réservé qu'au texte contenu entre
balises

L'autre "bug" de innerHTML est qu'il ne retient pas les events glissés
dans les balise (si non IE)

autre test :
http://members.aol.com/_ht_a/hikksnotathome/loadJSFile/index.html


je viens d'essayer en clônant, ça marche pas mieux...

mon html :
<body>
<div id="svg_id">
<img id="img_id" src="img/moving_png/lock_open_anim_08.png" />
<object id="object_id" data="leafnode_lock_opening_08.svg"
type="image/svg+xml"
width="600" height="600">
<embed id="embed_id" src="leafnode_lock_opening_08.svg"
type="image/svg+xml"
width="600" height="600"
pluginspage="http://www.adobe.com/svg/viewer/install/" />
</object>
</div>
</body>


ce que je veux changer c'est :

<object id="object_id" data="leafnode_lock_opening_08.svg"
là, le data=...
et :
<embed id="embed_id" src="leafnode_lock_opening_08.svg"
ici le src=...
j'en ai 17 à visulaiser ...

si je change juste ça, pas de changement dans le navigateur alors que
pour l'image ça marche très bien, il doit y avoir qqc de spécifique pour
svg ???

innerHTML, pas de changement ni avec ...cloneNode(true);

ouala le résultat de mes manips :[
--
Une Bévue

Avatar
yt.trash
ASM wrote:

http://stephane.moriaux.perso.wanadoo.fr/truc/yt/leaf_1.html

OK pour mon FF et mon Opera (mais pas Safari)


je pige qqc ça ne marche que parce que le navigateur recharge la page

parce que même avec ton code mais dans window.onload, pas de
changement...
--
Une Bévue

Avatar
yt.trash
ASM wrote:

OK pour mon FF et mon Opera (mais pas Safari)

Voir IE Win ?


inutile c'est juste pou un test, les svg ne me servent qu'à produire des
icônes png pour une application Cocoa...

donc, ça tourne à l'adresse, avec ton code :

<http://yvon-thoraval.com/SVG/essais/leafnode_lock_opening_svg/leafnode_
lock_opening.html>


merci bien !
--
Une Bévue

Avatar
ASM
ASM wrote:

http://stephane.moriaux.perso.wanadoo.fr/truc/yt/leaf_1.html

OK pour mon FF et mon Opera (mais pas Safari)


je pige qqc ça ne marche que parce que le navigateur recharge la page

parce que même avec ton code mais dans window.onload, pas de
changement...


Bien sur que si :

http://stephane.moriaux.perso.wanadoo.fr/truc/yt/leaf_2.html

Est-ce que tu ne pourrais pas virer les images :
- img/moving_png/lock_open_anim_08.png
- img/bord_new_600.png
de tes svg ?

J'ai comme l'impression que ça met la zone et alourdit inutilement
les chargements/mises en place.


Avatar
ASM
donc, ça tourne à l'adresse, avec ton code :


<http://yvon-thoraval.com/SVG/essais/leafnode_lock_opening_svg/leafnode_lock_opening.html>

Non ça marche pô !

Ça s'éteint
Et ça s'allume
C'est fait de
Tous petits riens
Ça se chante et ça se danse ...
La la la ...

Le clavier maudit a encore frappé ? ! ! ? !

1 2 3 4