快速代码获取没有jQuery

async  function product_serach(word) {
            var response = await fetch('<?php echo base_url(); ?>home/product_search?search='+word);
            var json = await response.json();
            for (let [key, value] of Object.entries(json)) 
            {
                console.log(json)
            }                                 
        }

现在在现代浏览器中有一个更好的本机Fetch API可用。fetch()方法允许您发出web请求。 例如，从/get-data请求一些JSON:

let options = {
  method: 'GET',      
  headers: {}
};

fetch('/get-data', options)
.then(response => response.json())
.then(body => {
  // Do something with body
});

更多细节请参见MDN Web Docs: Using Fetch API。

在浏览器中使用纯JavaScript:

var xhr = new XMLHttpRequest();

xhr.onreadystatechange = function() {
  if (xhr.readyState == XMLHttpRequest.DONE ) {
    if(xhr.status == 200){
      console.log(xhr.responseText);
    } else if(xhr.status == 400) {
      console.log('There was an error 400');
    } else {
      console.log('something else other than 200 was returned');
    }
  }
}

xhr.open("GET", "mock_data.json", true);

xhr.send();

或者如果你想使用Browserify使用node.js来捆绑你的模块。你可以使用超级代理:

var request = require('superagent');
var url = '/mock_data.json';

 request
   .get(url)
   .end(function(err, res){
     if (res.ok) {
       console.log('yay got ' + JSON.stringify(res.body));
     } else {
       console.log('Oh no! error ' + res.text);
     }
 });

xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
        alert(this.responseText);
    }
};
xhttp.open("GET", "ajax_info.txt", true);
xhttp.send();

使用XMLHttpRequest。

简单的GET请求

httpRequest = new XMLHttpRequest()
httpRequest.open('GET', 'http://www.example.org/some.file')
httpRequest.send()

简单的POST请求

httpRequest = new XMLHttpRequest()
httpRequest.open('POST', 'http://www.example.org/some/endpoint')
httpRequest.send('some data')

我们可以通过可选的第三个参数指定请求应该是异步(true)(默认值)或同步(false)。

// Make a synchronous GET request
httpRequest.open('GET', 'http://www.example.org/some.file', false)

我们可以在调用httpRequest.send()之前设置头信息

httpRequest.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');

我们可以通过设置httpRequest来处理响应。在调用httpRequest.send()之前，onreadystatechange函数

httpRequest.onreadystatechange = function(){
  // Process the server response here.
  if (httpRequest.readyState === XMLHttpRequest.DONE) {
    if (httpRequest.status === 200) {
      alert(httpRequest.responseText);
    } else {
      alert('There was a problem with the request.');
    }
  }
}

使用“vanilla”(普通)JavaScript:

function loadXMLDoc() {
    var xmlhttp = new XMLHttpRequest();

    xmlhttp.onreadystatechange = function() {
        if (xmlhttp.readyState == XMLHttpRequest.DONE) { // XMLHttpRequest.DONE == 4
           if (xmlhttp.status == 200) {
               document.getElementById("myDiv").innerHTML = xmlhttp.responseText;
           }
           else if (xmlhttp.status == 400) {
              alert('There was an error 400');
           }
           else {
               alert('something else other than 200 was returned');
           }
        }
    };

    xmlhttp.open("GET", "ajax_info.txt", true);
    xmlhttp.send();
}

jQuery:

$.ajax({
    url: "test.html",
    context: document.body,
    success: function() {
      $(this).addClass("done");
    }
});