chargement synchrone false
<html>
<head>
<title>titre de la page </title>
<script type="text/javascript">
//Requête HTTP synchrone :
// étape 1 : création de l'objet permettant de faire une Requête
var maRequete = new XMLHttpRequest()
// étape 2 : paramétrage de la requête
maRequete.open("GET","donnees.txt", false);
// étape 3 : envoyer la requête
maRequete.send(null);
// étape 4 : traitement des données reçues
alert(maRequete.responseText)
</script>
</head>
<body>
</body>
</html>
------------------------------------------------------
fichier :
donnees.xml
<imn>
<petitetudiant>Thérésa</petitetudiant>
<petitetudiant>Kazume</petitetudiant>
<petitetudiant>esther</petitetudiant>
<petitetudiant>malika</petitetudiant>
</imn>
-----------------------------------------------------------
1- methode du dom
<html>
<head>
<title>titre de la page </title>
<script type="text/javascript">
//Requête HTTP synchrone :
// étape 1 : création de l'objet permettant de faire une Requête
var maRequete = new XMLHttpRequest()
// étape 2 : paramétrage de la requête
maRequete.open("GET","donnees.xml", false);
// étape 3 : envoyer la requête
maRequete.send(null);
// étape 4 : traitement des données reçues
alert(maRequete.responseXML.getElementsByTagName("petitetudiant")[3].firstChild.nodeValue)
</script>
</head>
<body>
</body>
</html>
-----------------------------------------
2 - Création de la fonction<html>
<head>
<title>titre de la page </title>
<script type="text/javascript">
function faireRequeteHTTP()
{
var maRequete = new XMLHttpRequest()
maRequete.open("GET","donnees.xml", false);
maRequete.send(null);
alert(maRequete.responseXML.getElementsByTagName("petitetudiant")[3].firstChild.nodeValue);
}
window.onload = faireRequeteHTTP
</script>
</head>
<body>
<h1> </h1>
</body>
</html>
------------------------------------------3 -
------------------------------------------
------------------------------------------
6 - chargement asynchrone true = c'est un fichier AJAX
<html>
<head>
<title>titre de la page </title>
<script type="text/javascript">
function faireRequeteHTTP()
{
var maRequete = new XMLHttpRequest()
maRequete.open("GET","donnees.xml", false);
maRequete.send(null);
document.getElementsByTagName("h1")[0].innerHTML = maRequete.responseXML.getElementsByTagName("petitetudiant")[3].firstChild.nodeValue
}
window.onload = faireRequeteHTTP
</script>
</head>
<body>
<h1> </h1>
</body>
</html>
------------------------------------------
4 - chargement asynchrone true = c'est un fichier AJAX
<html>
<head>
<title>titre de la page </title>
<script type="text/javascript">
var maRequete
function madeleine()
{ if(maRequete.readyState == 4)
{document.getElementsByTagName("h1")[0].innerHTML = maRequete.responseXML.getElementsByTagName("petitetudiant")[3].firstChild.nodeValue}
}
function faireRequeteHTTP()
{
maRequete = new XMLHttpRequest()
maRequete.open("GET","donnees.xml", true);
maRequete.onreadystatechange = madeleine
maRequete.send(null);
}
window.onload = faireRequeteHTTP
</script>
</head>
<body>
<h1> </h1>
</body>
</html>
------------------------------------------
5 - chargement asynchrone true = c'est un fichier AJAX
<html>
<head>
<title>titre de la page </title>
<script type="text/javascript">
var maRequete
function madeleine()
{ if(maRequete.readyState == 4)
{ var etudiant1 = maRequete.responseXML.getElementsByTagName("petitetudiant")[0].firstChild.nodeValue;
document.getElementsByTagName("h1")[0].innerHTML = etudiant1;
}
}
function faireRequeteHTTP()
{
maRequete = new XMLHttpRequest()
maRequete.open("GET","donnees.xml", true);
maRequete.onreadystatechange = madeleine
maRequete.send(null);
}
window.onload = faireRequeteHTTP
</script>
</head>
<body>
<h1> </h1>
</body>
</html>
------------------------------------------6 - chargement asynchrone true = c'est un fichier AJAX
<html>
<head>
<title>titre de la page </title>
<script type="text/javascript">
var maRequete
function madeleine()
{ if(maRequete.readyState == 4)
{ var lesEtudiants = maRequete.responseXML.getElementsByTagName("petitetudiant");
var etudiant1 = lesEtudiants[0].firstChild.nodeValue;
var etudiant2 = lesEtudiants[1].firstChild.nodeValue;
document.getElementsByTagName("h1")[0].innerHTML = etudiant1 + " " + etudiant2 ;
}
}
function faireRequeteHTTP()
{
maRequete = new XMLHttpRequest()
maRequete.open("GET","donnees.xml", true);
maRequete.onreadystatechange = madeleine
maRequete.send(null);
}
window.onload = faireRequeteHTTP
</script>
</head>
<body>
<h1> </h1>
</body>
</html>
Articles
