ECM5 Fetch

<html>
<body>
    <button onclick="fetchImage()">Fetch</button>
    <button onclick="ajaxRequest()">Ajax</button>
    <button onclick="ajaxRequest2()">Ajax2</button>
    <script type="text/javascript">
        "use strick";
        const imgURL="https://images.pexels.com/photos/235767/pexels-photo-235767.jpeg?cs=srgb&dl=pexels-pixabay-235767.jpg&fm=jpg&w=640&h=427";
        let fetchImage= async()=>{
            var myImageResponse= await fetch(imgURL);
            console.log("Image response:\n",myImageResponse.blob());
        }
        function ajaxRequest(){
            function reqListener(){
                console.log(this.response);
            }
            var xmlRequest=new XMLHttpRequest();
            xmlRequest.addEventListener("load",reqListener.bind(xmlRequest));
            xmlRequest.open("GET",imgURL);
            xmlRequest.send();
        }
        
        function ajaxRequest2(){
            
            var xmlRequest=new XMLHttpRequest();
            xmlRequest.open("GET",imgURL);
            xmlRequest.send();
            xmlRequest.onload=function(e){
                console.log(xmlRequest.response);
            }
        }
    </script>
</body>
</html>

 

posted @ 2022-10-14 11:04  CrazyJC  阅读(137)  评论(0编辑  收藏  举报