11550 sujets

JavaScript, DOM et API Web HTML5

Bonjour,

Comment faire pour modifier les paramètres d'un lien HTML lorsque l'on clique dessus??? (Si c'est possible!!!Je le pense car je sais que le javascript est traité coté client et que le HMTL également donc il y a moyen de modifier le nom de la classe CSS appelé dans une balise HTML à l'aide de javascript)
viz a écrit :
Bonjour,

Comment faire pour modifier les paramètres d'un lien HTML lorsque l'on clique dessus??? (Si c'est possible!!!Je le pense car je sais que le javascript est traité coté client et que le HMTL également donc il y a moyen de modifier le nom de la classe CSS appelé dans une balise HTML à l'aide de javascript)

peux tu donner plus de preicsions stp ? ou au moins un bout de code de ton arbre
Bonjour,

Rapidement, ajouter un id sur le lien concerné puis dans la partie Javascript l'utiliser pour cibler le bon élément et faire la modification de l'attribut par la méthode setAttribute du DOM soit :

document.getElementById("id_du_lien").onclick = function ()
{ this.setAttribute("nom_attribut","valeur_attribut"); return false; }


Bonne continuation.
Romain
Modifié par yodaswii (18 May 2007 - 15:49)
document.getElementById("id_du_lien").onclick = function (){ 
this.id = "nouvel_id_du_lien"; 
alert(document.getElementById("nouvel_id_du_lien").id);
return false; }


Fais si tu veux le test si dessus pour verifier, mais il n'y a aucune raison pour que ça ne marche pas.
Hello

J'ai toujour et encore un problème :

Voici mon code javascript en début de ma page HTML


<SCRIPT Language="javascript">

   function DefineStyle(elemOrder)
   {
   if(elemOrder==1)
       {
       alert('The style has changed in elem 1');     
    document.getElementById(linkSelected).style.background-image="img/Business.gif";
       }
   }

</SCRIPT>


Ensuite plus bas dans le code j'ai mon DIV


<div id="linkSelected" style="background-image:url(img/transparent.gif);background-repeat:no-repeat;background-position:1% 50%;padding-left:25px;color: #000000;">


Et pour finir lorsque je clique sur mon lien, j'appelle ma fonction javascript :

<a href="%%ELEMURL%%" target="%%ELEMTARGET%%" onClick="DefineStyle(1);">%%ELEMTITLE%%</a>


Es-ce que quelqu'un saurait où se trouve mon erreur????
Ou alors ce qui ne vas pas???
Modifié par viz (21 May 2007 - 09:23)
document.getElementById([b]'linkSelected'[/b]).style.background-image="img/Business.gif";

je pense que ca vient de la . il faut mettre des ' ' dans les get ElementById
Modérateur
Salut,

Je n'ai survolé ton post que vite fait et ai peut-être oublié des choses... Smiley cligne

<SCRIPT Language="javascript">
...
</SCRIPT>
à remplacer par :
<script type="text/javascript">//<![CDATA[
...
//]]></script>
(les minuscules son indispensables si tu es en xhtml)



document.getElementById(linkSelected).style.background-image="img/Business.gif";

à remplacer par :
var oA = document.getElementById('linkSelected');
oA.className = 'maClasse';
avec :
.maClasse
{
   background-image: url(img/Business.gif);
}
En gros, il est préférable de laisser à CSS ce qui lui est dévolu. Cela facilite la maintenance (tous les styles à ta page sont au même endroits) et te permet de préciser le media auquel ce style est destiné.

Et comme te l'a dit hakkou, attention aux guillemets (ou apostrophes). Smiley cligne

PS : En JS, on aurait écrit backgroundImage et pas background-image mais ça n'a pas lieu d'être puisqu'il vaut mieux passer par l'attribution d'une classe.
Modifié par koala64 (21 May 2007 - 09:42)
J'ai essayé mais cela ne change rien! Et je ne comprend pas pourquoi!!

Je pense qu'il y a une erreur dans le document.GetElementById... lorsque j'appelle ma fonction javascript. Car j'ai fait le test en remplacant cette focntion par un alert('Voici un test') et là ça fonctionne.

J'y comprend plus grand chose
viz a écrit :
J'ai essayé mais cela ne change rien! Et je ne comprend pas pourquoi!!

Je pense qu'il y a une erreur dans le document.GetElementById... lorsque j'appelle ma fonction javascript. Car j'ai fait le test en remplacant cette focntion par un alert('Voici un test') et là ça fonctionne.

J'y comprend plus grand chose

ta mis les '' ? de lus c'est quoi l'erreur que t'a ?
c'est document.getElementById et non document.GetElementById...
Merci ça fonctionne !!!

En effet l'erreur était du au fait que j'appelait une fonction qui n'existait pas dans :


document.getElementById(...).style.backgroundImage='url(test1.jpg)';


Merci encore!! Smiley biggrin