ajax 入门（L01）

最新推荐文章于 2020-04-03 23:19:21 发布

weixin_34249678

最新推荐文章于 2020-04-03 23:19:21 发布

阅读量55

点赞数

CC 4.0 BY-SA版权

原文链接：https://juejin.im/post/5bcfd1faf265da0afd4b79a4

本文介绍了一种使用XMLHttpRequest的GET方法从服务器加载纯文本文件的方法。通过添加事件监听器，实现点击按钮触发文本加载，并展示了两种处理响应的方式：onload和onreadystatechange。这是前端开发中常见的网络请求技术。

<body>
	<button id="button">请求纯文本</button>
	
    <script>
    	document.getElementById('button').addEventListener('click', loadText);

    	function loadText(){
    		var xhr = new XMLHttpRequest();
    		// type {get, post} url/file{ 地址 } , async {true, false}
    		xhr.open('get', 'sample.txt', true)

            // 两种方式请求  onload / onreadystatechange
            xhr.onload =  function(res){
                console.log(this.responseText)
            }

            xhr.onreadystatechange  = function(){
                xhr.readyState;
                xhr.status;
                console.log(this.responseText)
            }

            xhr.send(); // 发送请求
    	}
    </script>
</body>

复制代码