[Résolu]Test MSIE propre pour "display = table-row || block"

Bonjour bonjour !
Respectant les recommandations lues ici et là, j'essaie de supprimer tout test MSIE du genre :

if(isMSIE) {}
ou
(isie() ? "solutionMSIE" : "solutionFF")

...préférant en cela les formules du genre :

if(window.getComputedStyle){ // Mozilla Firefox & cie
else if(element.currentStyle){ // Microsoft Internet Explorer
ou
var target = event.target || event.srcElement; // Moz || MSIE

Mais je ne sais pas comment faire un test aussi propre pour :

maTable.rows[numRow].style.display = "table-row"; // Mozilla
maTable.rows[numRow].style.display = "block"; // MSIE

(et je n'en ai pas trouvé dans alsa ou ailleurs)

Une proposition ?
Modifié par Gill (02 Oct 2007 - 17:21)

Salut,

L'idéal est de manipuler des className plutôt que de modifier directement les styles en ligne. Par exemple :

[b]CSS[/b]
tr.hidden {display: none;}

[b]JavaScript[/b]
function setRowHidden(tr, hidden) {
  tr.className = hidden ? "hidden" : "";
}

Le principe 'className" est très intéressant et je le note
(je vais certainement l'appliquer à la table elle-même qui est référencée dans la feuille CSS et dont l'invisibilité pose justement problèmes avec MSIE) !
Par ailleurs, l'idée de ne gérer que des display:none (qui, eux, fonctionnent quelque soit le navigateur) est intéressante. J'étais d'ailleurs parti sur cette idée, mais...

Hélas, la modularité de cette table dynamique fait qu'il ne me semble pas judicieux de créer une classe par cellule.

Je cherche donc toujours à éviter mon horrible code actuel :

maTable.rows[numRow].style.display = (isie()?"block":"table-row");

L'avantage du className est qu'il permet de ne pas mélanger les problématiques liées à JavaScript (comportement) et aux CSS (présentation).

J'ai peur qu'il n'existe aucune solution "propre" à ton problème si tu veux passer par les styles en ligne, puisque rien ne permet a priori de savoir si le navigateur utilisé supporte "display: table-row".

Si l'élément "tr" n'est pas en "display: none" par défaut dans tes feuilles de style, je pense que tu peux tout simplement écrire :

maTable.rows[numRow].style.display = "";

qui te permettra de revenir à la valeur de "display" par défaut.

C'est parfait ! Plus besoin de solution "propre" à mon display:table-row, puisque je n'ai plus à l'utiliser .

J'avais souvent vu style.display = "" dans des codes, mais je n'avais pas compris que c'était un moyen de revenir aux valeurs par défaut ... Moi, je voulais faire le plus clair possible.

J'agite donc mon drapeau |[Résolu]

Gill a écrit :
J'avais souvent vu style.display = "" dans des codes, mais je n'avais pas compris que c'était un moyen de revenir aux valeurs par défaut ...

En fait, pour être plus précis, ça permet d'effacer la valeur définie pour la propriété "display" dans le style en ligne, et donc d'appliquer les parties moins prioritaires de la cascade CSS.