Introduction aux méthodes get et post basées sur js native et ajax ainsi qu'à la méthode d'écriture native de jsonp

Ce qui suit vous présente un exemple des méthodes get et post basées sur js native et ajax, ainsi que la méthode d'écriture native de jsonp. Le contenu est assez bon, je vais donc le partager avec vous maintenant et le donner comme référence.

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);
};
};
}
}

méthode ajax

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);
}
)

méthode post passant les paramètres

La différence entre celle-ci et la méthode get :

01 Type de sécurité. la poste est plus sûre.

02 vitesses. La vitesse d'obtention est plus rapide que

03 ordres de grandeur. L'ordre de grandeur du post est plus grand

Mise en œuvre spécifique :

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);
};
};
}

Méthode jsonp native

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);
}

Ce qui précède est l'intégralité du contenu de cet article, j'espère qu'il vous sera utile à l'apprentissage de chacun, plus Veuillez faire attention au site Web PHP chinois pour le contenu connexe !

Recommandations associées :

Implémentation native d'Ajax À propos de l'utilisation des types MIME

Écrire la fonction de requête Ajax en JS natif Fonction

Manière correcte de transmettre les paramètres de la fonction de rappel ajax

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!