Ajax（非同期通信）

GETで通信

var xhr = new XMLHttpRequest();

xhr.open('GET', http://xxx?param=value);
xhr.send();

xhr.onreadystatechange = function() {

    if(xhr.readyState === 4 && xhr.status === 200) {
        //処理
    }
}

POSTで通信

var xhr = new XMLHttpRequest();

xhr.open('POST', http://xxx);
xhr.send('param=value');

xhr.onreadystatechange = function() {

    if(xhr.readyState === 4 && xhr.status === 200) {
        //処理
    }
}

イベント毎に非同期通信をする場合の例（入力がある毎に通信）

function_ajax();
function function_ajax() {

    var xhr = new XMLHttpRequest();

    const $input = document.querySelector('#id');
    //#idを持たないページはここで処理が終わる
    if (!$id) {
        return;
    }

    $input.addEventListener('input', function () {

        xhr.onreadystatechange = function() {
            if(xhr.readyState === 4 && xhr.status === 200) {
                //処理
            }
        }

        xhr.open('GET', 'http://xxx?param=value');
        xhr.send();
    });
}