SoFunction
Updated on 2025-04-10

Write ajax instance using native js (recommended)

Write ajax instance using native js (recommended)

Updated: May 31, 2017 07:46:50 Submission: jingxian
Below, the editor will bring you an example of writing ajax using native js (recommended). The editor thinks it is quite good, so I will share it with you now and give you a reference. Let's take a look with the editor

Examples are as follows:

// Encapsulate ajax using native js// Compatible with xhr objectsfunction createXHR(){
  if(typeof XMLHttpRequest != "undefined"){ // Non-IE6 browser    return new XMLHttpRequest();
  }else if(typeof ActiveXObject != "undefined"){  // IE6 browser    var version = [
          ".6.0",
          ".3.0",
          "",
    ];
    for(var i = 0; i < ; i++){
      try{
        return new ActiveXObject(version[i]);
      }catch(e){
        //jump over      }
    }
  }else{
    throw new Error("Your system or browser does not support XHR objects!");
  }
}
// Escape charactersfunction params(data){
  var arr = [];
  for(var i in data){
    (encodeURIComponent(i) + "=" + encodeURIComponent(data[i]));
  }
  return ("&");
}
// Encapsulate ajaxfunction ga_ajax(obj){
  var xhr = createXHR();
   =  + "?rand=" + (); // Clear cache   = params();   // Escape string  if( === "get"){   // Determine whether the use of the get method to send     += ("?") == "-1" ? "?" +  : "&" + ;
  }
  // Asynchronous  if( === true){
    // Onreadystatechange event needs to be triggered when asynchronous     = function(){
      // Execution is completed      if( == 4){
        callBack();
      }
    }
  }
  (,,); // false is synchronous true is asynchronous // "?rand="+()+"&name=ga&ga",  if( === "post"){
    ("Content-Type","application/x-www-form-urlencoded");
    ();
  }else{
    (null);
  }
  // (); // Cancel the asynchronous request  // Synchronize  if( === false){
    callBack();
  }
  // Return data  function callBack(){
    // Determine whether the return is correct    if( == 200){
      ();
    }else{
      ("Failed to get data, error code:"++"Error message is:"+);
    }
  }
}

var html = ("html")[0];
 = function(){
  ga_ajax({
    "method" : "post",
    "url" : "",
    "data" : {
      "name" : "gao",
      "age" : 100,
      "num" : "12346&598"
    },
    "success" : function(data){
      alert(data);
    },
    "Error" : function(text){
      alert(text);
    },
    "async" : false
  });
}

The above article using native js to write ajax example (recommended) is all the content I share with you. I hope you can give you a reference and I hope you can support me more.

  • Native js
  • ajax

Related Articles

  • Common ways to solve JavaScript precision problems

    In JavaScript, you often encounter the problem of accuracy loss when processing floating point numbers. This is because JavaScript uses the IEEE 754 standard to represent floating point numbers internally, which makes it impossible to express certain decimals accurately. This article will introduce some common methods to solve the accuracy problems in JavaScript and discuss their advantages and disadvantages. Friends who need it can refer to it.
    2024-05-05
  • ztree method to get the currently selected node child node id collection

    This article mainly introduces the method of ztree to obtain the currently selected node child node id collection. The example analyzes the method of ztree transformToArray usage techniques. Friends who need it can refer to it
    2015-02-02
  • A brief discussion on usage experience

    This article mainly introduces a brief discussion of usage experience. It is a technical prototype mainly used to display PDF documents on the HTML5 platform without any local technical support. Very practical, friends who need it can refer to it
    2018-06-06
  • About the use in JavaScript

    This article mainly introduces the usage methods in JavaScript, which are of great reference value. I hope it will be helpful to everyone. If there are any errors or no complete considerations, I hope you will be very encouraged.
    2023-12-12
  • JS implements a very practical couplet ad code (adaptively adaptable)

    This article mainly introduces JS to implement very practical couplet advertising codes, which can realize functions such as floating display in fixed relative positions and sliding up and down the screen. It has certain reference value. Friends who need it can refer to it.
    2015-09-09
  • Example of the Nine-Nine Multiplication Expression written by JS based on For statement

    This article mainly introduces the nine-nine multiplication written by JS based on for statements, involving related operation techniques for loop output of for statements combined with table table layout to realize the nine-nine multiplication function. Friends who need it can refer to it
    2018-01-01
  • JS object-oriented programming object usage analysis

    Before the rise of AJAX, many people could say that they were unorganized in writing JS. Basically, they wrote whatever they thought, just function functions one after another. When they encountered duplicates, they had to copy them. If they accidentally renamed the function, they really didn't know where to start looking for errors.
    2010-08-08
  • JS implementation ajax asynchronous browser compatibility issues

    This article explains the compatibility issue of JS to implement ajax asynchronous browser by using example code. The code is simple and easy to understand, very good, and has reference value. If you need it, please refer to it.
    2017-01-01
  • WeChat applet realizes carousel effect with thumbnails

    This article mainly introduces in detail to everyone the WeChat mini program realizes the carousel effect with thumbnails, which has certain reference value. Interested friends can refer to it.
    2018-11-11
  • Bootstrap learning tutorials worth sharing and collection

    This is definitely a set of Bootstrap learning tutorials worth sharing and collecting. A complete knowledge system and systematic learning materials will help you start your Bootstrap learning journey and enjoy the wonderful fun Bootstrap brings to you.
    2016-05-05

Latest Comments