done homework JS3W1

abdellatifketoun · abdellatifketoun · commit e1d35e3f04b8 · 2020-03-04T20:47:19.000+02:00
diff --git a/Week1/homework/js-exercices/dogPhoto.js b/Week1/homework/js-exercices/dogPhoto.js
@@ -0,0 +1,47 @@
+//function with XMLHTTPREQUEST
+
+function ranImg() {
+  try{
+    let xhttp = new XMLHttpRequest();
+    xhttp.onreadystatechange = function() {
+    if (this.readyState == 4 && this.status == 200) {
+      
+      let myUl=document.createElement('ul');
+      let myLi=document.createElement('li');
+      let myImg=document.createElement('img');
+      let myDiv=document.getElementById('btn');
+      myImg.src=((JSON.parse(xhttp.responseText)).message);
+      myImg.style.width="200px";
+      myImg.style.height="200px";
+      myLi.appendChild(myImg);
+      myUl.appendChild(myLi);
+      myDiv.appendChild(myUl);
+      
+    }
+    };
+    xhttp.open("GET", "https://dog.ceo/api/breeds/image/random", true);
+    xhttp.send();
+  }catch(e){console.log("une erreur s'est produite");}
+}
+
+
+//function with AXIOS
+
+async function ranImg1() {
+  
+     try{ 
+        const response = await axios.get('https://dog.ceo/api/breeds/image/random');
+        let myUl=document.createElement('ul');
+        let myLi=document.createElement('li');
+        let myImg=document.createElement('img');
+        let myDiv=document.getElementById('btn');
+        myImg.src=response.data.message;
+        myImg.style.width="200px";
+        myImg.style.height="200px";
+        myLi.appendChild(myImg);
+        myUl.appendChild(myLi);
+        myDiv.appendChild(myUl); 
+     }catch{
+        console.log("une erreur c'est produite");
+     }  
+}
diff --git a/Week1/homework/js-exercices/index.html b/Week1/homework/js-exercices/index.html
@@ -0,0 +1,24 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=\, initial-scale=1.0">
+    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
+    <title>Document</title>
+</head>
+<body>
+    
+    <h2>Randomized dog photo gallery</h2>
+
+    <div id="btn">
+    <button type="button" onclick="ranImg()">Change Content</button>
+    <button type="button" onclick="ranImg1()">Change Content</button>
+    </div>
+
+    <script src="dogPhoto.js">
+
+
+    </script>
+
+</body>
+</html>
diff --git a/Week1/homework/js-exercices/programmerHummor.html b/Week1/homework/js-exercices/programmerHummor.html
@@ -0,0 +1,18 @@
+
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
+    <title>Document</title>
+</head>
+<body>
+    
+
+
+<script src="programmerHummor.js" >
+    
+</script>
+</body>
+</html>
diff --git a/Week1/homework/js-exercices/programmerHummor.js b/Week1/homework/js-exercices/programmerHummor.js
@@ -0,0 +1,51 @@
+//function with XMLHTTPREQUEST
+
+logApiHummor();
+function logApiHummor(){
+    var xhttp;
+    var myData;
+    var image = document.createElement("img");
+    
+    var body=document.body;
+    
+    try{
+        xhttp = new XMLHttpRequest();
+    }catch(e){
+        try{
+            xhttp = new ActiveXObject("Microsoft.XMLHTTP");
+        }catch(e){console.log("Erreur")}
+    }
+    try{
+        xhttp.onreadystatechange = function() {
+            if (xhttp.readyState == 4 && xhttp.status == 200) {
+                myData=(JSON.parse(xhttp.responseText)[0]);
+                image.src=myData.url;
+                console.log(myData);
+            }
+        };
+        xhttp.open("GET","https://jsonplaceholder.typicode.com/photos", true);
+        xhttp.send();
+    }catch{
+        console.log("une erreur c'est produite");
+    }
+    body.appendChild(image);
+}
+
+
+//function with axios
+
+ (async function logApiHummor(){
+    var image = document.createElement("img");
+    try{
+        const response = await axios.get('https://jsonplaceholder.typicode.com/photos')
+        console.log(response.data[0]);
+        image.src=response.data[0].url;
+    }catch{
+        console.log("une erreur c'est produite");
+    }
+    
+    
+    var body=document.body;
+    body.appendChild(image);
+  })();
+
diff --git a/Week1/homework/js-exercices/whoHere.js b/Week1/homework/js-exercices/whoHere.js
@@ -0,0 +1,37 @@
+//function with XMLHTTPREQUEST
+
+logApiData1();
+function logApiData1(){
+    var xhttp;
+    try{
+        xhttp = new XMLHttpRequest();
+    }catch(e){
+        try{
+            xhttp = new ActiveXObject("Microsoft.XMLHTTP");
+        }catch(e){console.log("Erreur")}
+    }
+    try{
+        xhttp.onreadystatechange = function() {
+            if (xhttp.readyState == 4 && xhttp.status == 200) {
+                console.log((JSON.parse(xhttp.responseText))[0]);
+            }
+        };
+        xhttp.open("GET","https://jsonplaceholder.typicode.com/users", true);
+        xhttp.send();
+    }catch{
+        console.log("une erreur c'est produite");
+    }
+}
+
+//function with axios
+
+const axios = require ('axios');
+ (async function logApiData1(){
+    try{
+        const response = await axios.get('https://jsonplaceholder.typicode.com/users')
+        console.log(response.data[0]);
+    }catch{
+        console.log("une erreur c'est produite");
+    }
+  })()
+
