11548 sujets

JavaScript, DOM et API Web HTML5

[résolu] Afficher les ID's avec un alert

Bonjour tout le monde, je suis en train de bosser sur un script, et je veux afficher les identifiants d'une liste, mais je ne trouve pas ni ne sais comment arriver a ce résultat.

Voila mon code :


<table>
	<tr valign="top">
		<td style="width:50%; border: 1px #000000 solid">
		<b><center><u>Liste 1</u></center></b><br />
			<ul id="liste1" style="padding:0px;margin:0px;list-style:none;">
			
				<li id="elem1" style="position:relative;background-color:white;">
				<div style="border:1px solid black;padding:5px;margin:5px;text-align:center;">
				<h2 style="cursor:move">Boite 1</h2>
				<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</p>
				</div>
				</li>
				
				<li id="elem2" style="position:relative;background-color:white;">
				<div style="border:1px solid black;padding:5px;margin:5px;text-align:center;">
				<h2 style="cursor:move">Boite 2</h2>
				<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</p>
				</div>
				</li>
				
			</ul>
		</td>
		<td style="width:50%; border: 1px #000000 solid">
		<b><center><u>Liste 2</u></center></b><br />
			<ul id="liste2" style="padding:0px;margin:0px;list-style:none;">
				
				<li id="elem3" style="position:relative;background-color:white;">
				<div style="border:1px solid black;padding:5px;margin:5px;text-align:center;">
				<h2 style="cursor:move">Boite 3</h2>
				<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</p>
				</div>
				</li>
				
				<li id="elem4" style="position:relative;background-color:white;">
				<div style="border:1px solid black;padding:5px;margin:5px;text-align:center;">
				<h2 style="cursor:move">Boite 4</h2>
				<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</p>
				</div>
				</li>
				
			</ul>
		</td>
	</tr>
</table><br /><br />
<input type="button" name="Test" value="Test" onClick="Lire();">



Quand je vais cliquer sur le boutton, je voudrais que la fonction Lire() m'afficher les id des éléments de la liste 'liste1' et pareil pour la 'liste2'.


Pour l'instant ma fonction c'est ça, mais ca ne marche pas (ce qui me semble logique) Smiley langue 


function Lire() {
			var test = document.getElementById("liste1");
			
			alert(test);
		};




Est ce que se que je veux faire est possible et si oui comment je peux faire ?


Merci a vous.
Modifié par DevJoe (07 Dec 2007 - 10:21)
Salut,

comme ça ça devrait fonctionner :


function Lire() {
			var test = document.getElementById("liste1");
			alert(test.id);
};
Ok la ca affiche bien liste1, mais moi j'aimerai afficher les elements de la liste1 en gros, elem1, elem2.


En tout cas c'est un bon début merci Smiley smile
Hello,

Testé et approuvé (du moins sous Firefox...):

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<title></title>
	<link rel="stylesheet" type="text/css" media="screen" href="" />
	<style type="text/css">Test</style>
	<script type="text/javascript">
	function lireIds(id_parent,tag_enfant) {
		if (!document.getElementById || !document.getElementsByTagName) return false;
		if (!document.getElementById(id_parent)) return false;
		var elements = document.getElementById(id_parent).getElementsByTagName(tag_enfant);
		for (var j=0; j<elements.length; j++) {
			id_en_cours = elements[j].getAttribute("id");
			if (id_en_cours) {
				alert ("Element " + (j+1) + ": id=" + id_en_cours);
			} else { alert ("Element " + (j+1) + ": pas d'id"); }
		}
	}
	window.onload = function() {
		lireIds("test2","li");
	}
	</script>
</head>

<body>

<ul id="test1">
    <li>Test</li>
	<li>Suite</li>
	<li>Bla bla</li>
</ul>

<ul id="test2">
    <li id="valeur_1">Test</li>
	<li>Suite</li>
	<li id="valeur_3">Bla bla</li>
</ul>

</body>
</html>
Ah ouais c'est ça que je veux, maintenant je vais un peu le modifier, pour mettre ca dans une bdd merci Smiley smile
Sujet clos
Aller à