js

javascript, jquery, vue.js でajaxする方法MEMO

2018.10.1 
    <article id="content" class="markdown-body">
      <h1>jsでajax 3パターン</h1>

Javascript

function getJSON() {
  var req = new XMLHttpRequest();
  req.onreadystatechange = function() {
    if(req.readyState == 4 && req.status == 200){
      console.log(req.responseText)
      obj = JSON.parse(req.responseText);
      console.log(obj)
    }
  };
  req.open("GET", "myjson.json", false);
  req.send(null);
}
getJSON();

vue

axios.get('myjson.json')
  .then( function(response) {
    console.log(response)
  })
  .catch( function() {
    console.log(response)
  })

JQuery

var jqxhr = $.getJSON( "myjson.json", function() {
  console.log( "success" );
  console.log(data)
})
.done(function() {
  console.log( "second success" );
})
.fail(function() {
  console.log( "error" );
})
.always(function() {
  console.log( "complete" );
});

    </article>

BLOG TOP