ajax를 사용하면 jquery를 도입할 필요가 없습니다. ajax의 전체 이름은 "비동기 JavaScript 및 XML"입니다. 즉, 대화형 웹 애플리케이션을 만들기 위한 웹 개발 기술을 의미하는 JavaScript입니다. . 기본 Ajax 요청을 사용하는 경우에는 jquery를 도입할 필요가 없습니다.
이 기사의 운영 환경: windows10 시스템, javascript1.8.5&&html5 버전, DELL G3 컴퓨터.
js는 원래 ajax를 지원합니다. 기본 ajax 요청을 사용한다면 당연히 jquery 라이브러리를 호출할 필요가 없습니다!
AJAX는 "Asynchronous javascript and XML"(asynchronous javascript and XML)의 약자로, 대화형 웹 애플리케이션을 만들기 위한 웹 개발 기술을 말합니다. AJAX를 사용하면 백그라운드에서 서버와 소량의 데이터를 교환하여 웹 페이지를 비동기적으로 업데이트할 수 있습니다. 이는 전체 페이지를 다시 로드하지 않고도 웹페이지의 일부를 업데이트할 수 있음을 의미합니다.
AJAX를 사용하는 이유는 무엇인가요? AJAX의 장점?
AJAX는 새로운 프로그래밍 언어가 아니라 더 훌륭하고 빠르며 대화형인 웹 애플리케이션을 만들기 위한 기술입니다.
Javascript를 사용하여 서버에 요청하고 사용자를 차단하지 않고 응답을 처리하세요! 핵심 객체 XMLHTTPRequest. 이 개체를 통해 JavaScript는 페이지를 다시 로드하지 않고도 웹 서버와 데이터를 교환할 수 있습니다.
AJAX는 브라우저와 웹 서버 간의 비동기 데이터 전송(HTTP 요청)을 사용하므로 웹 페이지가 전체 페이지 대신 서버에서 소량의 정보를 요청할 수 있습니다.
AJAX는 인터넷 애플리케이션을 더 작고, 더 빠르고, 더 사용자 친화적으로 만듭니다.
AJAX는 웹 서버 소프트웨어와 독립적인 브라우저 기술입니다. AJAX는 JavaScript, XML, HTML, CSS와 같은 웹 표준을 기반으로 합니다. AJAX에서 사용되는 웹 표준은 모든 주요 브라우저에서 잘 정의되고 지원됩니다. AJAX 애플리케이션은 브라우저와 플랫폼에 독립적입니다.
웹 애플리케이션은 데스크톱 애플리케이션에 비해 많은 장점이 있습니다. 광범위한 사용자에게 접근할 수 있고, 설치 및 유지 관리가 더 쉽고, 개발도 더 쉽습니다.
그러나 인터넷 애플리케이션은 기존 데스크톱 애플리케이션만큼 완전하고 사용자 친화적이지 않습니다. AJAX를 통해 인터넷 애플리케이션은 더욱 완전해지고 사용자 친화적이 될 수 있습니다.
JavaScript에서 Ajax 사용.
Get 메서드 구현:
<script type="text/javascript"> var xmlHttpRequest; //创建XHR对象 function createXmlHttpRequest() { // if(typefo(XMLHttpRequest)!='undifine') if (window.ActiveXObject) { //如果是IE浏览器 return new ActiveXObject("Microsoft.XMLHTTP"); } else if (window.XMLHttpRequest) { //非IE浏览器 return new XMLHttpRequest(); } } //Ajax调用的方法 function AjaxClick() { var url = "这里是你想要请求的URL,其中包括你的参数(?key1=value1&key2=value2)"; //1.创建XMLHttpRequest组建 xmlHttpRequest = createXmlHttpRequest(); //2.设置回调函数 xmlHttpRequest.onreadystatechange = ajaxCallBack; //onreadystatechange。存储函数(或函数名),每当 readyState 属性改变时,就会调用该函数。 //3.初始化XMLHttpRequest组建 xmlHttpRequest.open("GET", url, true); //open(method,url,async),规定请求的类型、URL 以及是否异步处理请求。 //method:请求的类型;GET 或 POST //url:文件在服务器上的位置 //async:true(异步)或 false(同步) //GET方式请求可以设置浏览器不使用缓存,需加上下面这段 //xhr.setRequestHeader("If-Modified-Since", "0"); //4.发送请求 xmlHttpRequest.send(null); } //回调函数 function ajaxCallBack() { //readyState 存有 XMLHttpRequest 的状态。从 0 到 4 发生变化。 //0: 请求未初始化 //1: 服务器连接已建立 //2: 请求已接收 //3: 请求处理中 //4: 请求已完成,且响应已就绪 //status 请求响应状态码 //200: "OK" //404: 未找到页面 if (xmlHttpRequest.readyState == 4 && xmlHttpRequest.status == 200) { //表示请求成功,且正常响应 //responseText 获得字符串形式的响应数据。 //responseXML 获得 XML 形式的响应数据。 var data = xmlHttpRequest.responseText; //你具体的代码操作写在这里,如对请求响应的数据如何处理 } } </script>
Post 메서드 구현:
<script type="text/javascript"> var xmlHttpRequest; //创建XHR对象 function createXmlHttpRequest() { if (window.ActiveXObject) { //如果是IE浏览器 return new ActiveXObject("Microsoft.XMLHTTP"); } else if (window.XMLHttpRequest) { //非IE浏览器 return new XMLHttpRequest(); } } //Ajax调用的方法 function AjaxClick() { var url = "这里是你想要请求的URL,不包括参数"; //1.创建XMLHttpRequest组建 xmlHttpRequest = createXmlHttpRequest(); //2.设置回调函数 xmlHttpRequest.onreadystatechange = ajaxCallBack; //3.初始化XMLHttpRequest组建 xmlHttpRequest.open("POST", url, true); //4.添加请求头: xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); //5.发送请求,send("这里是你的请求参数") xmlHttpRequest.send("key1=value1&key2=value2"); } //回调函数 function ajaxCallBack() { if (xmlHttpRequest.readyState == 4 && xmlHttpRequest.status == 200) { var data = xmlHttpRequest.responseText; //你具体的代码操作写在这里,如对请求响应的数据如何处理 } } </script>
【관련 튜토리얼 추천: AJAX 동영상 튜토리얼】
위 내용은 Ajax를 사용하려면 jquery를 도입해야 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!