快捷導(dǎo)航

JavaScript調(diào)用ajax獲取文本文件內(nèi)容實(shí)現(xiàn)代碼

更新時(shí)間：2014年03月28日 14:45:47 作者：

這篇文章主要介紹了JavaScript調(diào)用ajax獲取文本文件內(nèi)容的方法,需要的朋友可以參考下

這幾年JQuery寫(xiě)多了，傳統(tǒng)的的javascript已經(jīng)很久不寫(xiě)了，不少東西都忘掉了，還有多少人記得javascript中實(shí)現(xiàn)ajax操作需要借助XMLHttpRequest對(duì)象，其實(shí)jquery的ajax本質(zhì)也是這個(gè)，好了，今天就花點(diǎn)時(shí)間演示一下如何用傳統(tǒng)javascript獲取文本內(nèi)容并展示在頁(yè)面上，廢話(huà)不多少，直接上代碼，注釋寫(xiě)的很詳細(xì)，大家應(yīng)該能看懂：

復(fù)制代碼代碼如下:

 
<script type="text/javascript"> 
//(A)①獲取文本文件方法(傳統(tǒng)javascript實(shí)現(xiàn)AJAX寫(xiě)法) 
function LoadXMLDoc1() 
{ 
var xmlhttp; 
if(window.XMLHttpRequest) 
{ 
// code for IE7+, Firefox, Chrome, Opera, Safari 
xmlhttp=new XMLHttpRequest(); 
} 
else 
{ 
// code for IE6, IE5 
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
} 
//onreadystatechange 存儲(chǔ)函數(shù)（或函數(shù)名），每當(dāng) readyState 屬性改變時(shí)，就會(huì)調(diào)用該函數(shù)。 
xmlhttp.onreadystatechange=function() 
{ 
//readyState 
//存有 XMLHttpRequest 的狀態(tài)。從 0 到 4 發(fā)生變化。 
//0: 請(qǐng)求未初始化 
//1: 服務(wù)器連接已建立 
//2: 請(qǐng)求已接收 
//3: 請(qǐng)求處理中 
//4: 請(qǐng)求已完成，且響應(yīng)已就緒 
//status 
//200: "OK" 
//404: 未找到頁(yè)面 
if (xmlhttp.readyState==4 && xmlhttp.status==200) 
{ 
document.getElementById("myDiv1").innerHTML=xmlhttp.responseText; 
} 
} 
xmlhttp.open("GET","doc/test1.txt",true); 
xmlhttp.send(); 
} 

html頁(yè)面代碼：

復(fù)制代碼代碼如下:

 
<body> 
<form id="form1" runat="server"> 
<%-- 獲取服務(wù)器上的文本文件并顯示--%> 
<div id="myDiv1"><h2>通過(guò)ajax改變內(nèi)容</h2></div> 
<button id="btnChange1" type="button" onclick="LoadXMLDoc1()">通過(guò) AJAX 改變內(nèi)容(獲取test1.txt上面的文本)</button> 
</form> 
</body> 

演示效果：

您可能感興趣的文章:

相關(guān)文章

JS按位非(~)運(yùn)算符與~~運(yùn)算符的理解分析
按位非運(yùn)算符，簡(jiǎn)單的理解就是改變運(yùn)算數(shù)的符號(hào)并減去1，當(dāng)然，這是只是簡(jiǎn)單的理解能轉(zhuǎn)換成number類(lèi)型的數(shù)據(jù)
2011-07-07
一文帶你了解微信小程序數(shù)據(jù)綁定、事件綁定以及事件傳參、數(shù)據(jù)同步
在微信小程序日常開(kāi)發(fā)中,特定場(chǎng)景下我們需要事件攜帶參數(shù)到要執(zhí)行的函數(shù)中,下面這篇文章主要給大家介紹了關(guān)于微信小程序數(shù)據(jù)綁定、事件綁定以及事件傳參、數(shù)據(jù)同步的相關(guān)資料,需要的朋友可以參考下
2022-11-11
前端開(kāi)發(fā)之JS生成32位隨機(jī)數(shù)的方法舉例
最近有個(gè)需求,是需要生成32位長(zhǎng)度的隨機(jī)數(shù),下面這篇文章主要給大家介紹了關(guān)于前端開(kāi)發(fā)之JS生成32位隨機(jī)數(shù)的相關(guān)資料,文中通過(guò)實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下
2023-01-01
去掉gridPanel表頭全選框的小例子
這篇文章介紹了去掉gridPanel表頭全選框的小例子，有需要的朋友可以參考一下
2013-07-07
js實(shí)現(xiàn)本地圖片文件拖拽效果
這篇文章主要為大家詳細(xì)介紹了js實(shí)現(xiàn)本地圖片文件拖拽效果，拖拽文件到指定位置，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2017-07-07
JavaScript中各種時(shí)間轉(zhuǎn)換問(wèn)題詳解(YYYY-MM-DD、時(shí)間戳、中國(guó)標(biāo)準(zhǔn)時(shí)間)
在某些場(chǎng)景下,需要將時(shí)間轉(zhuǎn)換為字符串進(jìn)行展示或傳遞,下面這篇文章主要給大家介紹了關(guān)于JavaScript中各種時(shí)間轉(zhuǎn)換問(wèn)題(YYYY-MM-DD、時(shí)間戳、中國(guó)標(biāo)準(zhǔn)時(shí)間)的相關(guān)資料,需要的朋友可以參考下
2024-02-02
一道關(guān)于JavaScript變量作用域的面試題
這篇文章主要為大家介紹了一道關(guān)于JavaScript變量作用域的面試題，如何解決這道面試題，感興趣的小伙伴們可以參考一下
2016-03-03
JS時(shí)間戳與日期格式的轉(zhuǎn)換小結(jié)
這篇文章主要介紹了JS時(shí)間戳與日期格式的轉(zhuǎn)換小結(jié),本文通過(guò)實(shí)例代碼給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友參考下吧
2024-01-01
微信{"errcode":48001,"errmsg":"api unauthorized, hints: [ req_
這篇文章主要介紹了微信{"errcode":48001,"errmsg":"api unauthorized, hints: [ req_id: 1QoCla0699ns81 ]"}，非常具有實(shí)用價(jià)值，需要的朋友可以參考下
2018-10-10
JavaScript數(shù)據(jù)結(jié)構(gòu)之二叉查找樹(shù)的定義與表示方法
這篇文章主要介紹了JavaScript數(shù)據(jù)結(jié)構(gòu)之二叉查找樹(shù)的定義與表示方法,簡(jiǎn)單講述了二叉查找樹(shù)的概念、特點(diǎn)及javascript針對(duì)二叉查找樹(shù)的創(chuàng)建、插入、遍歷等操作相關(guān)實(shí)現(xiàn)技巧,需要的朋友可以參考下
2017-04-04