기술나눔

AJAX란 무엇입니까? 기본 구문 형식? 패키지화된 AJAX를 제공하는 jQuery의 차이점은 무엇입니까?

2024-07-12

한어Русский языкEnglishFrançaisIndonesianSanskrit日本語DeutschPortuguêsΕλληνικάespañolItalianoSuomalainenLatina

아약스 이름 비동기 JavaScript 및 XML(비동기식 자바스크립트 그리고 XML) 

아작스대화형 웹 애플리케이션을 만들기 위한 웹 개발 기술입니다.핵심 종속성은 브라우저가 제공하는 XMLHttpRequest 객체입니다. 브라우저가 발행할 수 있도록 하는 것은 바로 이 객체입니다. HTTP 요청하고 받기 HTTP 응답. 페이지를 새로 고치지 않고도 서버와 상호 작용할 수 있습니다.

기본 AJAX 구문 형식:

  1. let xhr = new XMLHttpRequest();
  2. xhr.open('get','js/index.json',true);
  3. xhr.send();
  4. xhr.onreadystatechange = function() {
  5. if (xhr.readyState == 4 && xhr.status == 200) {
  6. let text = xhr.responseText;
  7. console.log(text);
  8. let data = JSON.parse(text);
  9. console.log(data);
  10. }
  11. };
아약스를 사용하는 방법:
1. XMLHttpRequest 객체 생성
2. open 메소드를 사용하여 요청할 주소, 유형 및 메소드를 지정하십시오.
3. 매개변수를 전달해야 하는 경우 send 메소드를 사용하여 요청을 보냅니다.
get 메소드를 사용하려면 매개변수를 URL 끝에 연결하고 매개변수를 분리해야 합니다. 예: 'index.php?name=张三&age=18'
post 메소드는 매개변수를 send()에 넣을 수 있습니다. 예: send('이름=张三&age=18')
4. onreadystatechange 이벤트를 바인딩하여 ReadyState 및 상태를 확인합니다.
5. 데이터를 받아 json 변환을 통해 사용합니다.

 

jQuery는 개발 프로젝트에 사용하기에 더 빠르고 적합한 패키지 AJAX를 제공합니다. 기본 AJAX는 이해하기 쉽고 이해하기 쉽습니다.

jQuery 구문 형식:

  1. $.ajax({
  2. type: "GET",
  3. url: 'js/exercise.json',
  4. data: {},
  5. headers:'',
  6. datatype:'',
  7. async:'',
  8. success: function(result) {
  9. console.log(result);
  10. data = result;
  11. },
  12. Error: function(e) {
  13. console.log(e.status);
  14. console.log(e.responseText);
  15. },
  16. });