mettre en MAJ toute balise text avec le DOM
bonjour à tous!
je cherche à effectuer une boucle permettant de mettre en majuscule toute balise <p> avec un identifiant donné. Je passe par les commande du DOM.
Dand le code ci-dessous, le nb de balise <p> est 1 alors qu'il y en a deux dans le html. Pourtant la boucle est présente!
-- html --
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21
| <html>
<head>
<script type="text/javascript" src="MettreEnMajuscule.js"></script>
</head>
<body>
<p id="M">1 texte balise p</p>
<p id="M">2 texte balise p</p>
<button onclick="enMajuscules(document.getElementById('M'));">Click Me</button>
</body>
</html> |
-- JS --
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39
| function enMajuscules(n) {
/* Mise en majuscule */
if (n.nodeType == 3 /*Node.TEXT_NODE*/) {
n.data = n.data.toUpperCase();
alert("1")
}
/* Incrémentation du compteur */
else
{
// hasChildNodes renvoie une valeur booléenne indiquant si l'élement actuel possède des nuds enfants.
if (n.hasChildNodes()) {
alert("hasChildNodes renvoie la valuer : " + n.hasChildNodes());
// L'attribut javascript childNodes de l'objet Node permet de récupérer tous les noeuds enfants du noeud.
// On vérifie d'abord si l'objet n'est pas vide, c.-à-d. s'il a des enfants
var enfants = n.childNodes;
alert("Nb de noeuds enfants : " + enfants.length);
for(var nb = 0; nb < enfants.length; nb++){
if(enfants[nb].nodeType==3){
alert("-- Trouve balise <p></p> à Identification 'M' --");
alert("Nb total de balise <p></p> à Identification 'M' : " + enfants.length);
enfants[nb].data = enfants[nb].data.toUpperCase();
}
else{
alert("!!");
}
}
}
}
} |
merci d'avance de votre aide!