这几年JQuery写多了，传统的的javascript已经很久不写了，不少东西都忘掉了，还有多少人记得javascript中实现ajax操作需要借助XMLHttpRequest对象，其实jquery的ajax本质也是这个，好了，今天就花点时间演示一下如何用传统javascript获取文本内容并展示在页面上，废话不多少，直接上代码，注释写的很详细，大家应该能看懂： 复制代码 代码如下: <br>//(A)①获取文本文件方法(传统javascript实现AJAX写法) <br>function LoadXMLDoc1() <br>{ <br>var xmlhttp; <br>if(window.XMLHttpRequest) <br>{ <br>// code for IE7 , Firefox, Chrome, Opera, Safari <br>xmlhttp=new XMLHttpRequest(); <br>} <br>else <br>{ <br>// code for IE6, IE5 <br>xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); <br>} <br>//onreadystatechange 存储函数（或函数名），每当 readyState 属性改变时，就会调用该函数。 <br>xmlhttp.onreadystatechange=function() <br>{ <br>//readyState <br>//存有 XMLHttpRequest 的状态。从 0 到 4 发生变化。 <br>//0: 请求未初始化 <br>//1: 服务器连接已建立 <br>//2: 请求已接收 <br>//3: 请求处理中 <br>//4: 请求已完成，且响应已就绪 <br>//status <br>//200: "OK" <br>//404: 未找到页面 <br>if (xmlhttp.readyState==4 && xmlhttp.status==200) <br>{ <br>document.getElementById("myDiv1").innerHTML=xmlhttp.responseText; <br>} <br>} <br>xmlhttp.open("GET","doc/test1.txt",true); <br>xmlhttp.send(); <br>} <br> </div> <br>html页面代码： <br><div class="codetitle"> <span><a style="CURSOR: pointer" data="28324" class="copybut" id="copybut28324" onclick="doCopy('code28324')"><u>复制代码</u></a></span> 代码如下:</div> <div class="codebody" id="code28324"> <br><body> <br><form id="form1" runat="server"> <br><%-- 获取服务器上的文本文件并显示--%> <br><div id="myDiv1"><h2>通过ajax改变内容</h2></div> <br><button id="btnChange1" type="button" onclick="LoadXMLDoc1()">通过 AJAX 改变内容(获取test1.txt上面的文本)</button> <br></form> <br></body> <br> </div> <br>演示效果： <br><img src="http://files.jb51.net/file_images/article/201403/20140328144459.gif?2014228144542" alt="JavaScript调用ajax获取文本文件内容实现代码_javascript技巧" >
