<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>無標題文檔</title>
<!--<script src="jquery.js"></script>-->
<script>
//$(function(){}) //阻塞 -> 同步
//非阻塞 - 異步
/*setTimeout(function() {
alert(1);
}, 2000);
alert(2);*/
window.onload = function() {
var oBtn = document.getElementById('btn');
oBtn.onclick = function() {
//打開瀏覽器
/*
1.創建一個ajax對象
ie6以下new ActiveXObject('Microsoft.XMLHTTP')
*/
var xhr = null;
/*if (window.XMLHttpRequest) {
xhr = new XMLHttpRequest();
} else {
xhr = new ActiveXObject('Microsoft.XMLHTTP');
}*/
try {
xhr = new XMLHttpRequest();
} catch (e) {
xhr = new ActiveXObject('Microsoft.XMLHTTP');
}
//alert( xhr.readyState );
//在地址欄輸入地址
/*
open方法
參數
1.打開方式
2.地址
3.是否異步
異步:非阻塞 前面的代碼不會影響後面代碼的執行
同步:阻塞 前面的代碼會影響後面代碼的執行
*/
xhr.open('get','1.txt',true);
//提交 發送請求
//alert(1);
xhr.send();
//alert( xhr.readyState );
//alert(1)
//alert( xhr.responseText );
//等待服務器返回內容
/*
readyState : ajax工作狀態
responseText : ajax請求返回的內容就被存放到這個屬性下面
on readystate change : 當readyState改變的時候觸發
status : 服務器狀態,http狀態碼
*/
xhr.onreadystatechange = function() {
if ( xhr.readyState == 4 ) {
if ( xhr.status == 200 ) {
alert( xhr.responseText );
} else {
alert('出錯了,Err:' + xhr.status);
}
}
}
}
}
</script>
</head>
<body>
<input type="button" value="按鈕" id="btn" />
</body>
</html>
表單:數據的提交
action : 數據提交的地址,默認是當前頁面
method : 數據提交的方式,默認是get方式
1.get
把數據名稱和數據值用=連接,如果有多個的話,那麼他會把多個數據組合用&進行連接,然後把數據放到url?後面傳到指定頁面
url長度限制的原因,我們不要通過get方式傳遞過多的數據
2.post
理論上無限制
enctype : 提交的數據格式,默認application/x-www-form-urlencoded
<form action="1.post.php" method="post">
<input type="text" name="username" />
<input type="text" name="age" />
<input type="submit" value="提交" />
</form>