11548 sujets

JavaScript, DOM et API Web HTML5

Bonjour,
je suis débutant en javascript.
je voudrais lister et compter tous les IDs d'une page commençant par "calque" par exemple.

J'ai réussi sous IE :


calqRootname = "calque"
for (obj in document.all) {
	if ((document.all[obj].id != undefined) && (document.all[obj].id != "")) { 
		if ((document.all[obj].id.indexOf(calqRootName) == 0) && (document.all[obj].id.length > calqRootName.length)) {
			nbCalq += 1
			alert ('=> ' + document.all[obj].id )
		} 
	}
}


sous FF, j'ai remplacé document.all par document.ids ou document.layers[] mais ça ne me donne rien.
COmment faire ?

Merci d'avance.
Sergio
Modifié par sergiobzh (15 Sep 2005 - 17:40)
Bonjour et bienvenue sur le forum,

Afin d'avoir un code interopérable, il vaut mieux utiliser le DOM (Document Object Model) de la page, qui permet justement d'accéder directement à un élément dont tu connais l'attribut id. Par extension, tu peux donc utiliser cette méthode getElementById() appliquée à l'objet document pour chercher ce que tu souhaites
plus dinfos sur getElementById()

Bon courage!
Bonjour,
Une solution qui ne marche pas sur IE qui ne connait pas :
document.getElementsByTagName('*');

<html> 
<head> 
<script> 
nbCalq=0;calqRootName="calque"
function scanId() {
  var elts = document.getElementsByTagName('*');
  for (var j = 0; j < elts.length; ++j) {
    if (elts[j].id.indexOf(calqRootName) == 0 )  {
      nbCalq += 1
      alert ('=> ' + elts[j].id )
      }
    }
  };
</script> 
</head> 
<body onload="scanId();"> 
<form id="calque1"> 
<table id="mon_calque"> 
    <tbody id="tb"></tbody> 
</table> 
<button id="calque_02" type="button" >+</button> 
<input type="submit"> 
</form> 
</body> 
</html>
chmel a écrit :

Bonjour Olivier, je pensait que ça vennait de là car toi-même a constaté le blème dans ta * Méthode .getElementsByClassName


Oui mais la méthode foire, mais c'est pas à cause de ça, c'est juste que getAttribute('class') ne fonctionne pas sous IE, il faut utiliser getAttribute('className')

getElementsByTagName('*'); fonctionne.


Donc pour notre interessé, un truc du style :

function getIDsLike(IDLike)
{
var elts = document.getElementsByTagName('*');
var IDsArray = new Array();
for (var j = 0; j < elts.length; ++j) {
if (elts[j].getAttribute('id')) {
if (isIDLike(elts[j].getAttribute('id'), IDLike) {
IDsArray.push(elts[j]);
}
}
}
}


Bon, là il manque la fonction isIDLike(str1, str2)
C'est une fonction qui compare la chaine str1 à str2 et qui renvoi true ou false suivant que la comparaison est fructueuse.
Donc tout dépend de ce que tu veux.
Si tu veux genre "tous les ids de la forme "UNTEXTEFIXE-----" où ----- est n'importe quoi, tu devras faire ce test. "UNTEXTEFIXE" correspond à str2

En gros c'est la marche à suivre.

Par contre, maintenant que j'ai fait tout ça, je me demande où est l'interêt Smiley ohwell Ca serait pas mieux de faire avec des class ?

(p.s. le code doit être moyen, j'ai fait ça à l'arrache)
la méthode getElementsByTagName('*') me va très bien. En plus ça marche avec IE, FF et mozilla 1.7, ça réduit le code.

Merci !
Sergio
Si jamais, il est aussi possible de se baser sur la fonction getElementsByAttribute que j'ai postée dans le topic des fonctions hand made.
en ensuite de comparer avec le tableau reçu.
Olivier a écrit :
IE reconnait getElementsByTagName('*'); il me semble.

à partir de la version 6 seulement, car ce midi, j'était avec IE5.0 et
elts.length
me donnait 0
Smiley cligne
chmel a écrit :

à partir de la version 6 seulement, car ce midi, j'était avec IE5.0 et
elts.length
me donnait 0
Smiley cligne


/me se tire une balle...
Bonjour,
Olivier a écrit :


/me se tire une balle...


Marche sur IE 5.0 avec :
var elts = document.all ? document.all : document.getElementsByTagName('*');


Petite question hors sujet :
Pourquoi
elts[j].getAttribute('id'))

puisque
elts.id
fonctionne partout ? hé
chmel a écrit :

Petite question hors sujet :
Pourquoi
elts[j].getAttribute('id'))

puisque
elts.id
fonctionne partout ? hé


Parce que la première méthode est orientée objet et plus généraliste que la seconde (elle peut être adaptée sans aucune difficulté à un autre attribut). On peut croire que dans le futur, une telle approche sera peut-être plus répandue, et que la seconde tombera en désuétude voire ne sera plus supportée...
Gilles a écrit :


Parce que la première méthode est orientée objet et plus généraliste que la seconde (elle peut être adaptée sans aucune difficulté à un autre attribut). On peut croire que dans le futur, une telle approche sera peut-être plus répandue, et que la seconde tombera en désuétude voire ne sera plus supportée...


+1 Smiley lol

Idem avec setAttribute('attr', 'value');

@chmel > ça restera comme ça Smiley lol Et les IE5 users se passeront du script (pour ma part).
Pas envie de saloper mon code pour les papys Smiley cligne Mais merci du renseignement, on sait jamais Smiley smile
Modifié par Olivier (16 Sep 2005 - 13:02)