Xmlhttp实现静态刷新

来源：互联网发布：npm 安装node sass 编辑：程序博客网时间：2024/05/17 23:38

写的比较粗糙,自己写的,留个记念

在default.aspx上每五秒钟请求数据服务页面,以达到静态刷新的目的.

//DataService.aspx(数据服务页) 代码
private void Page_Load(object sender, System.EventArgs e)
{
// 在此处放置用户代码以初始化页面
DataSet ds = new DataSet();
System.Data.SqlClient.SqlConnection sqlCon = new System.Data.SqlClient.SqlConnection("server=.;database=xmlhttp;uid=sa;pwd=123456");
sqlCon.Open();
using(System.Data.SqlClient.SqlDataAdapter sqlAda = new System.Data.SqlClient.SqlDataAdapter("select * from temptable",sqlCon))
{
sqlAda.Fill(ds);
}
sqlCon.Close();
System.Xml.XmlTextWriter xmlWriter = new System.Xml.XmlTextWriter(this.Response.OutputStream,Response.ContentEncoding);
ds.WriteXml(xmlWriter);
xmlWriter.Flush();
Response.End();
xmlWriter.Close();
}

//default.aspx页面,请求数据服务页面并解析,这个页面,可以是全静态的
<%@ Page language="c#" Codebehind="default.aspx.cs" AutoEventWireup="false" Inherits="xmlHttp._default" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
<HEAD>
<title>default</title>
<meta name="GENERATOR" Content="Microsoft Visual Studio .NET 7.1">
<meta name="CODE_LANGUAGE" Content="C#">
<meta name="vs_defaultClientScript" content="JavaScript">
<meta name="vs_targetSchema" content="http://schemas.microsoft.com/intellisense/ie5">
<script language="javascript">
var oDiv;
function GetData()//请求数据并解析
{
document.all.refresh.style.display = "NONE";
document.all.div2.innerText = "正在更新数据";
document.all.div2.style.display = "BLOCK";
var tablelength = refresh.rows.length ;
                               for(var i=1 ;i< tablelength;i++) //清空表格以前的数据
                               {
document.all.refresh.deleteRow(1);
}

var objXmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
var objXmlDom = new ActiveXObject("MSXML.DOMDOCUMENT");
objXmlHttp.open("post","DataService.aspx",false);
objXmlHttp.send();
var result = objXmlHttp.responseText; //得到数据xml格式的文件
oDiv = document.all.div1;
objXmlDom.loadXML(result);    //读取
var root = objXmlDom.documentElement; //获得根节点
var oNodeList = root.childNodes; //获得子节点
for(var i=0;i<oNodeList.length;i++) //遍历子节点
{
if(oNodeList(i).hasChildNodes)
{
var childList = oNodeList(i).childNodes;
var row = document.all.refresh.insertRow(); //添加到table中
var cell1 = row.insertCell();
var cell2 = row.insertCell();
cell1.innerHTML = childList(1).text;
cell2.innerHTML = childList(2).text;
}
}

oDiv.innerText = result;
document.all.refresh.style.display = "BLOCK";
document.all.div2.style.display = "NONE"; //完成更新
}

function Start() //开始刷新
{
window.setInterval("GetData()",5000);
alert('开始更新');
}

</script>
</HEAD>
<body>
<form id="Form1" method="post" runat="server">
<input type="button" onclick="javascript:Start();" value="取得数据">
<hr color="#00cc00">
<div id="div2"></div>
<table id="refresh">
<tr>
<td>名字</td>
<td>介绍</td>
</tr>
</table>
<div id="div1"><FONT face="宋体"></FONT></div>
</form>
</body>
</HTML>

//数据库角本
create database xmlHttp
create table temptable
(
[id] int identity(1,1) primary key,
[name] varchar(40),
[introduce] varchar(500)
)

Xmlhttp实现 静态刷新

Xmlhttp实现静态刷新