现在有两个网站,分别在两个服务器上,一个是纯静态的网站,一个是asp.net网站,在asp.net网址中有一个新闻栏目是用用户控件里的DataList绑定数据库来显示的。
我现在想做的是想把asp.net网站中的那个显示新闻栏目的DataList的内容也显示在另一个纯静态网站的页面上,这样一来,静态网站也能同时更新,而且查看静态网站源文件的时候是显示的新闻的内容,而不是简单的一个调用!
请问:这样能实现吗?如果能实现,大体的步骤是什么?非常感谢!
我现在想做的是想把asp.net网站中的那个显示新闻栏目的DataList的内容也显示在另一个纯静态网站的页面上,这样一来,静态网站也能同时更新,而且查看静态网站源文件的时候是显示的新闻的内容,而不是简单的一个调用!
请问:这样能实现吗?如果能实现,大体的步骤是什么?非常感谢!
用iframe,将iframe的src指向该aspx页面
下面的方法可以查看下:使用 XMLHttpRequest 对象去请求aspx页面
可以返回aspx页面的所有html
在获取完整的html后
过滤掉不需要的节点
之后把剩下的需要的节点(就是 DataList 生产的html片段)
插入到静态页面的指定位置
var xmlhttp;
if (window.XMLHttpRequest) {
xmlhttp = new XMLHttpRequest();
xmlhttp.open("GET",url,false);
xmlhttp.send(null);
}
else if (window.ActiveXObject) {
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP")
if (xmlhttp) {
xmlhttp.open("GET",url,false);
xmlhttp.send();
}
}
if(xmlhttp.readyState==4) {
if(xmlhttp.status==200) {
return xmlhttp.responseText;
}
}
return xmlhttp.statusText;
};
具体的代码:
假设DataList最终生成的容器的ID为datalist1
动态页面的 URL 为 http://www.w.com/aspx.aspx<html>
<div id="container"><div>
</html><script type="text/javascript">
window.onload = function() {
// 获取动态页面所有HTML
var allHTML = ajaxRequest('http://www.w.com/aspx.aspx');
// TODO: 这里需要对allHTML做一些处理,剔除掉一些根节点
// 创建一个容器,用于存放接受到的HTML,以备截取需要的节点
var tempContainer = document.createElement('DIV');
tempContainer.innerHTML = allHTML;
tempContainer.style.display = 'none';
document.body.appendChild(tempContainer);
// 从allHTML中截取出 dataList 节点
var dataList = tempContainer.getElementById('datalist1');
var target = document.getElementById('container');
target.appendChild(dataList); // 删除临时的容器
document.body.removeChild(tempContainer);
}
</script>
ajax调用数据后还要依次赋值给每一个静态页元素.太烦琐了吧
然后将那个新闻的那一块包含起来就可以了。也可以采用ajax来读取那边生成的静态文件,这们的话,会麻烦一些。
如果不能控制那边的数据库,那就是先抓取对方网页内容,然后用正则解析需要的新闻部分,再通过ajax在静态页面上调用;当然这种方面效率非常低,如果不考虑数据实时的话,可用事先把数据抓到自己的数据库或者考虑缓存技术。