在 JavaScript 中,XMLHttpRequest 是客户端的一个 API,它为浏览器与服务器通信提供了一个便捷通道。现代浏览器都支持 XMLHttpRequest API,如 IE 7+、Firefox、Chrome、Safari 和 Opera。创建 XMLHttpRequest 对象XMLHttpRequest 用于在后台与服务器交换数据。创建 XMLHttpRequest 对象的方法如下:var xhr = new XMLHttpRequest (); IE 5.0 版本开始以 ActiveX 组件形式支持 XMLHttpRequest,IE 7.0 版本开始标准化 XMLHttpRequest。不过所有浏览器实现的 XMLHttpRequest 对象都提供相同的接口和用法。 示例下面示例使用工厂模式把定义 XMLHttpRequest 对象进行封装,这样只需要调用 creatXHR() 方法就可以返回一个 XMLHttpRequest 对象。//创建XMLHttpRequest 对象 //参数:无 //返回值:XMLHttpRequest 对象 function cr
点击按钮,请求远程图片接口并显示到页面上。html部分放一个空的div和一个按钮button即可,主要是js代码如下:const btn =document.querySelector('button') //获取按钮 btn.addEventListener('click',function(){ //创建Promise const p =new Promise((resolve,reject)=>{ //1.创建ajax请求对象 const xhr =new XMLHttpRequest() //2.初始化 xhr.open('get','https://api.vvhan.com/api/view?type=json') //3.发送 xhr.send() //4.处理响应结果 xhr.onreadystatechange=function(){ if(xhr.readyState === 4){
注:该实例需要在php环境运行目录结构如下图:先看页面部分,html代码如下:<body> <div id="container"> <div id="main"> <h1>请输入用户名输入数据</h1> </div> <div id="contorll"> <input type="text" id="uname"> <button>请求</button> </div> </div> <script src="demo.js"></script> </body>接下来是样式:body{ min-height: 100vh;
铅笔Naruto
前端攻城狮