ajax页面图标动态,ajax实现动态网页静态化

利用ajax实现动态网页静态化，是目前一个比较流行的网站开发技术。

在这里，我利用三个页面简单的实现一个效果：

Default.aspx、1.html、GetDate.aspx

在Default.aspx绑定新闻的标题，这里，我们也可以利用ajax从数据库中读取数据，这里就省了。

五个新闻标题，单击传一个Id到1.html这个页面中。，我们的1.html还是利用昨天的那个网页模板

在1.html这个页面的HTML代码中，我们利用js与ajax联合来实现

//首先获取URL路径，然后获取传过来的编号

var url=location.href;

var id=url.split('=');

var NewsId=id[1];

var NId=parseInt(NewsId);

if(isNaN(NId))

{

location.href="../information.html";

}

//利用ajax

var xmlhttp;

function GetStudent()

{

if(window.ActiveXObject)

{

xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");

}

else if(window.XMLHttpRequest)

{

xmlhttp =new XMLHttpRequest();

}

var url1="../GetDate.aspx?nid="+NId;

xmlhttp.open("GET",url1,true);

xmlhttp.onreadystatechange=ShowResult;

xmlhttp.send(null);

return false;//这里返回false就是为了屏蔽掉服务器端的时间

}

function ShowResult()

{

if(xmlhttp.readystate==4)

{

if(xmlhttp.status==200)

{

var reslut= new String( xmlhttp.responseText);

var myarr= reslut.split('|');

document.getElementById("title").innerHTML=myarr[0];

document.getElementById("content").innerHTML=myarr[1];

}

}

}

我们来看一下GetDate.aspx这个读取数据页的代码

public override void ProcessRequest(HttpContext context) //这是一个内置的方法，它是专门处理http信息的一个方法，具体讲解参看：http://technet.microsoft.com/zh-cn/cc680109.aspx

{

string title = null;

string content = null;

SqlConnection conn = new SqlConnection("server=.;uid=sa;pwd=;database=mydemo");

string str = "select * from Newsinfo where NewsId=@Id";

SqlCommand com = new SqlCommand(str, conn);

com.Parameters.Add("@Id", SqlDbType.Int, 4);

com.Parameters["@Id"].Value =context.Request.QueryString["nid"];

conn.Open();

SqlDataReader dr = com.ExecuteReader();

if (dr.Read())

{

title = dr["NewsTitle"].ToString();

content = dr["NewsBody"].ToString();

}

string Str1 =title+ "|" + content;

context.Response.Write(Str1);

}

到目前为止，我们任何从数据库读取到的数据，都会在一个静态页面上显示，实现了我们想要的结果。