[quote="Truc"]:lol: v'la que j'me fait taper sur les doigts[/quote]
Tu as sûrement vu ici:
http://developer.yahoo.com/yui/examples/dom/getelementsbyclassname.html

[b]@Aureusms[/b] Tu as raison, ça fonctionne sans variable tableau. J'ai dû confondre avec les <input> avec nom identique.

:lol: v'la que j'me fait taper sur les doigts

[quote="Truc"]Mouah j'étais persuadé que la recherche des éléments par class avec "getElementsByClassName" existait :oops:
[/quote]

Et tu m'a laissé en galère !!! :cry:
C'est pas bien :non2:

[i][color=darkred][Note : ce message a été posté de manière anonyme avant d'être réattribué à son auteur][/color][/i]

Mouah j'étais persuadé que la recherche des éléments par class avec "getElementsByClassName" existait :oops:
[size=75]Apparemment c'est le cas mais pour [url=http://developer.mozilla.org/fr/docs/DOM:document.getElementsByClassName]FF3[/url] revient d'ici 1 an :lol: [/size]

Oui tu as tout a fais compris! Je vais essayer cela merci encore.
Merci encore pour les librairies. Moi qui essayé de réinventer la roue... Merci encore!

[quote="Xenon_54"]

Note: Le Xenon porte le numéro 54. :)[/quote]

Chimiste ? moi c'est plutôt de l'argon :wink:



EDIT :
Est ce que c'est normal que tu utilises des attributs de tableau dans le "name" ?

EDIT(2) : j'ai enlevé les [] et çà marche sous FF (je développe que sous FF pour ma boîte donc no pb).

Voici le code pour ceux que cela intéresse :
HTML[code]
<p name="aucune_famille"
style="cursor: pointer;"
onclick="changeStyle('aucune_famille','display','none'); document.getElementById('question_article_aucune_famille').style.display='block';">Cacher les familles non utilisables
</p>
<p id="question_article_aucune_famille"
style="display:none; cursor: pointer;"
onclick="changeStyle('aucune_famille','display','block;'); document.getElementById('question_article_aucune_famille').style.display='none';">Afficher les familles non utilisables
</p>

<div style="display: block;" name="aucune_famille">
<h1>Q0</h1>
</div>
<div style="display: block;" name="aucune_famille">
<h1>Q1</h1>
</div>[/code]

et le javascript que j'ai adapté pour des utilisations ultérieures:
[code]function changeStyle(nom,type,valeur) {
var allElements = document.getElementsByName(nom);

if (type == 'display')
{
for (i=0;i<allElements.length;i++)
{
allElements[i].style.display = valeur;
}
}
}[/code]

Merci encore à vous trois !

Selon ma compréhension, tu désires modifier les attributs CSS de tous les éléments portant l'ID "box_article_aucune_famille". Puisque un ID doit être unique, tu ne peux faire sélectionner plusieurs éléments en te basant sur son ID. Mais tu peux le faire avec son nom (name).

L'exemple montré permettant donc de faire une recherche avec un nom et de récupérer l'élément HTML via Javascript. Tu peux donc en modifier les attributs CSS comme bon te semble:
[code]<div name="something[]" id="s1">1</div>
<div name="something[]" id="s2">2</div>
<div name="something[]" id="s3">3</div>

<script type="text/javascript">
function changeStyle() {
var allElements = document.getElementsByName('something[]');
for (i=0;i<allElements.length;i++) {
allElements[i].style.color = 'blue';
allElements[i].style.textDecoration = 'underline';
}
}
</script>

<input type="button" value="Changez-moi en bleu souligné!" onclick="changeStyle()">[/code]

Tu peux donc modifier les styles mais aussi les class avec setAttribute().

Pour ce genre de manipulations avec le DOM, je te recommende l'utilisation de librairies Javascript tel que [url=http://jquery.com/]jQuery[/url] ou même [url=http://developer.yahoo.com/yui/]YUI[/url].

Note: Le Xenon porte le numéro 54. :)

Bonjour Xenon_54 (gaz rare de Nancy ?),

Désolé mais je ne comprends pas pourquoi tu pars sur le "name". Cela affecte - t- il les "class" aussi ?

L'attribut name peut ne pas être unique. Tu peux donc l'utiliser pour sélectionner plusieurs éléments similaires.

Voici un exemple rapide que tu peux adapter à tes besoins:
[code]<div name="something[]" id="s1">1</div>
<div name="something[]" id="s2">2</div>
<div name="something[]" id="s3">3</div>

<script type="text/javascript">
var allElements = document.getElementsByName('something[]');
for (i=0;i<allElements.length;i++) {
document.write('Élément #' + i + ' avec ID ' + allElements[i].getAttribute('id') + '<br>');
}
</script>[/code]

Bonjour Truc,

J'ai cherché un peu avec tes indications et j'ai conclu (car je ne le savais pas) que pour travaillé avec des class il fallait mettre d'abord créer une sorte de tableau sur lequel on pouvait travailler.
Aussi j'ai créé cela mais cela ne produit aucun effet.

[code]function ChangeStyleClass(classe,type,valeur)
{
var divs = document.getElementsByClassName(classe);

for(var i=0; i<divs.length; i++)
{
if (type == 'display')
{
divs[i].style.display=valeur;
}

}
}[/code]

J'appelle la fonction via onclick="ChangeStyleClass('box_article_aucune_famille','display','none');" pour (essayer) d'affecter toute les <div> qui possède la class box_article_aucune_famille.

Où suis je dans l'erreur ?

[i][color=darkred][Note : ce message a été posté de manière anonyme avant d'être réattribué à son auteur][/color][/i]

var elem = getElementsByClassName("ouvrir");
for (... elem.length; i++ ...)
{
    elem[i].className = "fermer";
}

A vrai dire je n'ai même pas lu ton 1er message... j'ai vu deux attributs id c'est tout mais le souci était est bien la :wink:

Si tu te tournes vers les "class" tu modifieras tous les paragraphes (ayant l'attribut en commun) en même temps.
getElementsByClassName() devrait renvoyer un tableau avec les éléments.

Très sommairement
[php]var elem = getElementsByClassName("ouvrir");
for (... elem.length; i++ ...)
{
elem[i].className = "fermer";
}[/php]

Merci truc et Zeus de me répondre.

Pour répondre à Truc j'ai essayé mais mon problème réside dans le nombre de div à "effacer" (j'en ai afficher que 2 mais il y en a en tout une 40n). Je garde quand même l'idée car je pense qu'avec une fonction ca dois se faire même si je ne sais pas encore comment.

Pour répondre à Zeus (cette fois pas d'écriture en gras :lol: ) c'est vers cette voie que je me suis tourné mais quand j'ai essayé de faire document.getElementbyClass('...'), FF me retourne que la fonction n'existe pas. Je pense de ce côté qu'il s'agit d'un problème d'écriture (et donc de mes connaissances :twisted: ). Comment modifier un display: block vers un display:none sur une class CSS via javascript ?

PS. Au fait j'ai cela qui s'affiche sur votre site : [color=red]uncaught exception: Permission refusée d'appeler la méthode Location.toString[/color]

tu pourrait utiliser un name propre aux éléments qui doivent être effacés, ou encore une classe CSS.

un attribut "id" doit être unique sur une page !

Il te faut ruser un peu en ajoutant un id (identifiant) d'élement ou je ne sais quoi par id (attribut).

Bonjour,

J'ai un petit souci en Javascript. J'ai créé deux boutons avec la balises paragraphes :

[code]<p style="display: none;" id="box_article_aucune_famille" onclick="document.getElementById('question_article_aucune_famille').style.display='block'; document.getElementById('box_article_aucune_famille').style.display='none';">Cacher les familles non utilisables</p>
<p id="question_article_aucune_famille" style="display: block;" onclick="document.getElementById('question_article_aucune_famille').style.display='none'; document.getElementById('box_article_aucune_famille').style.display='block';">Afficher les familles non utilisables</p>[/code]

qui ont pour but de cacher ou d'afficher des <div> plus bas qui possèdent l'id "box_article_aucune_famille"


Cela marche bien mais que pour le bouton! Les div restent en effet affichés. Après quelques recherches cela n'affecte que le premier "id" de la page[code]
<div style="display: block;" id="box_article_aucune_famille">
<p style="text-align: left; padding-left: 2em; font-weight: bold; font-size: 120%;" title="Fluorescence atomique">
<span style="cursor: help; padding-bottom: 16px;">AF</span>
<img style="cursor: pointer;" src="themes/ewp/notebk/bu0496.ico" alt="" title="Créer la sous famille" border="0" height="32" width="32">
</p>
<hr>
</div>


<div style="display: block;" id="box_article_aucune_famille">
<p style="text-align: left; padding-left: 2em; font-weight: bold; font-size: 120%;" title="Demande biologique en oxygène">
<span style="cursor: help; padding-bottom: 16px;">BOD</span>
<img style="cursor: pointer;" src="themes/ewp/notebk/bu0496.ico" alt="" title="Créer la sous famille" border="0" height="32" width="32">
</p>
<hr>
</div>[/code]

Je travaille qu'avec FF 2.0. Comment faire pour affecter toute les div en une seule passe ?