Ajax初心者です。JQueryからAjaxを始めるとどうしてもおまじない感がでてしまい、ビハインドロジックを理解できないと思っているため、Ajaxをjavascriptで書いてみています。jsonでファイルを渡しているのですが、うまくいきません。(ステータスは200でPOSTで送信できているのですが、receive.php側の$_POSTに何も入っていません。。)もしよろしければご指導いただければと思います。
 

ajax.html
    
    <!DOCTYPE html>
    <html lang="en">
    <head>
    	<meta charset="UTF-8">
    	<title>ajax post</title>
    </head>
    <body>
    	<input id="one" type="text" value="aaa">
    	<input id="two" type="text">
    	<input id="three" type="text">
    	<button id="submit">送信</button>
    	<span id="output"></span>
    <script>
    	var button = document.getElementById('submit');
    
    	button.addEventListener('click', function(){
    	var one = document.getElementById('one').value;
    	var two = document.getElementById('two').value;
    	var three = document.getElementById('three').value;
    	console.log({one:one, two:two, three:three});
    
    	var text = JSON.stringify({one:one, two:two, three:three});
    	var xhr = new XMLHttpRequest();
    	if((xhr.status == 200) && (xhr.readyState == 4)){
    		console.log(xhr.responseText);
    	}
    
    	xhr.open('post', 'receive.php');
    	xhr.send(text);
    	},false);
    
    </script>
    </body>
    </html>

receive.php
    
    <?php 
    	var_dump($_POST);
    ?>