JQuery와 연구는 여섯 노트

AJAX 소개

AJAX는 서버와 데이터를 교환 할 수있는 기술로,이 페이지의 업데이트 부분을 달성하기 위해, 전체 페이지를 다시로드하지 않고 있습니다.

부하 () 메소드

부하 () 메소드는 서버로부터 데이터를로드하고, 상기 선택된 요소에 대한 데이터를 리턴한다.

문법

$(selector).load(URL,data,callback)

URL 매개 변수 필요한 사양은로드 할 URL입니다.
쿼리 스트링 파라미터는 요청 / 값 쌍과 함께 송신 키 선택 데이터를 소정.
선택적 콜백 파라미터가 수행 완료된 부하 ()에있어서의 함수의 이름이다.

예
1.로드 링크 파일

$(document).ready(function(){
    $("button").click(function(){
        $("#div1").load("/try/ajax/demo_test.txt");
    });
});

2.로드 링크 된 파일 콘텐츠 라벨을 지정

$("#div1").load("demo_test.txt #p1");

3.callback 파라미터 콜백 함수의 종료 후 소정의 하중 () 메소드가 허용 될 때. 콜백 함수는 다른 매개 변수를 설정할 수

responseTxt는 - 통화 내용이 성공하면 결과를 포함
statusTXT - 국가 통화 포함
XHR은 - XMLHttpRequest 객체를 포함

$("button").click(function(){
  $("#div1").load("demo_test.txt",function(responseTxt,statusTxt,xhr){
    if(statusTxt=="success")
      alert("外部内容加载成功!");
    if(statusTxt=="error")
      alert("Error: "+xhr.status+": "+xhr.statusText);
  });
});

HTTP 요청 : POST 대 GET

서버로부터 (검색) GET 실질적 데이터를 취득
POST는 또한 상기 서버로부터 데이터를 획득하기 위해 사용될 수있다

$ 갔지 () 메소드

문법

$.get(URL,callback);

URL 매개 변수 필요한 사양은 요청하려는 URL입니다.
옵션 콜백 매개 변수는 요청 후 실행 된 함수의 이름이 성공적이다.
다음 예제는 서버에있는 파일에서 데이터를 검색하기 위해 $ 갔지 () 메소드를 사용한다 :

예

("button").click(function(){
  $.get("demo_test.php",function(data,status){
    alert("数据: " + data + "\n状态: " + status);
  });
});

$ 갔지 () 첫 번째 매개 변수는 우리가 ( "demo_test.php")를 요청할 URL입니다.
두번째 매개 변수는 콜백 함수이다. 콘텐츠 페이지가 제 보정 파라미터 상태 요청을 요청한 제 콜백 매개 변수가있다.

$ .Post () 메소드

문법

$.post(URL,data,callback);

URL 매개 변수 필요한 사양은 요청하려는 URL입니다.
선택적 데이터 파라미터는 요청과 함께 전송 된 데이터를 소정.
옵션 콜백 매개 변수는 요청 후 실행 된 함수의 이름이 성공적이다.

  $.post("/try/ajax/demo_test_post.php",
    {
        name:"小明",
        url:"http://www.baidu.com"
    },
        function(data,status){
        alert("数据: \n" + data + "\n状态: " + status);
    });

충돌을 방지

jQuery를위한 속기로 $ 기호를 사용하여 jQuery를

noConflict () 메소드

릴리스 식별자 제어

$.noConflict();
jQuery(document).ready(function(){
  jQuery("button").click(function(){
    jQuery("p").text("jQuery 仍然在工作!");
  });
});

자신의 속기 만들기

var jq = $.noConflict();
jq(document).ready(function(){
  jq("button").click(function(){
    jq("p").text("jQuery 仍然在工作!");
  });
});

학습 JQuery와 예비 연구 노트 (육)