Vous êtes ici : » » Catégories : Codes  >/ Javascript  » Item : Atteindre un objet du DOM en Javascript

Item 139

Atteindre un objet du DOM en Javascript

Mise à jour du 27 avril 2015

Voici une petite fonction javascript qui permet de retourner l’identifiant d’un objet dans le DOM de la page en cours.


// Retourne l'identifiant de l'objet selon l'id et le navigateur
function trouveObjet(id) {
	var objet = null;
	if (document.layers) {
		objet = document.layers[id];
	} else if (document.all) {
		objet = document.all[id];
	} else if (document.getElementById) {
		objet = document.getElementById(id);
	}
	return objet;
}


Le principe est simple.

Dans le <body> de notre page se trouve un objet (une balise HTML) dont l’attribut ID a pour valeur ‘QQCH‘.

Dans le Javascript une variable servira à stocker l’identifiant de l’objet et il ne restera plus qu’à le manipuler.

La fonction crée dans un premier temps un objet ‘null’.
Cet objet sera notre valeur de retour de la fonction : null par défaut.
Puis viennent les tests :
Si le navigateur client est un Nestcape (si, si, il en reste encore…) alors je garde l’identifiant de l’objet.
Sinon est-ce un IE ? Idem.
Et enfin, sinon si c’est un navigateur ‘moderne’ ? Tjs Idem.

Un exemple :


<form>
<input type="button" id="bt" value="Test" onClick="tester()" />
<input type="text" id="temoin" value="Témoin" />
</form>
<script>
// Retourne l'identifiant de l'objet selon l'id et le navigateur
function trouveObjet(id) {
var objet = null;
if (document.layers) {
objet = document.layers[id];
} else if (document.all) {
objet = document.all[id];
} else if (document.getElementById) {
objet = document.getElementById(id);
}
return objet;
}

function tester(){
alert();
var leBouton    = trouveObjet('bt');
leBouton.value    = 'OK !';
var leTemoin    = trouveObjet('temoin');
leTemoin.style.backgroundColor    = 'red';
}
</script>


Tester !

Cet Item à été publié le 27 avril 2015 par Sébastien
dans : Codes | Javascript
et est marqué :

Laissez un commentaire

« -o|o- »