Detaillierte Erläuterung der Verwendung nativer Ajax-Get- und Post-Methoden

login.onclick = function(){
var xhr = new XMLHttpRequest();
xhr.open("get","http://localhost/ajax2/test2.php?username="+username.value+"&pwd="+pwd2.value,true);
xhr.send();
xhr.onreadystatechange = function(){
if (xhr.readyState == 4) {
if (xhr.status>=200 && xhr.status<300) {
alert(xhr.responseText);
};
};
}
}

Ajax-Methode

btn.onclick = function(){
ajax(
    "GET",
    "http://localhost/ajax2/my02.php",
    {xingming:xingming.value,pwd:pwd.value},
    function(data){
console.log(data);
},
function(errCode){
console.log(errCode);
}
)

Post-Methode, die Parameter übergibt

Der Unterschied zwischen ihr und der get-Methode:

01 Sicherheit Typ. Post ist sicherer.

02 Geschwindigkeit. Get ist schnell

03 Größenordnung. Die Größenordnung des Beitrags ist größer.

Detaillierte Umsetzung:

var xhr = new XMLHttpRequest();
xhr.open("post","http://localhost/ajax2/login2.php",true);
var data = {
username:username1.value,
pwd:pwd1.value
}
// 设置请求头 告诉服务器发给他的数据是json格式
xhr.setRequestHeader("content-type","application/json");
xhr.send( JSON.stringify(data) );
xhr.onreadystatechange = function(){
if (xhr.readyState == 4) {
if ( xhr.status >= 200 && xhr.status < 300 ) {
alert(xhr.responseText);
};
};
}

Native JSONP-Methode

var sc = document.createElement("script");
sc.type = "text/javascript";
document.body.appendChild(sc);
sc.src = "http://localhost/ajax2/jsonp.php?cb=myCallBack";
function myCallBack(data){
console.log(data);
}

Ich glaube, dass Sie die Methode beherrschen, nachdem Sie den Fall in diesem Artikel gelesen haben. Für weitere spannende Informationen achten Sie bitte auf andere verwandte Artikel auf der chinesischen PHP-Website!

Empfohlene Lektüre:

Das obige ist der detaillierte Inhalt vonDetaillierte Erläuterung der Verwendung nativer Ajax-Get- und Post-Methoden. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!