html中,如果需要在frame中放2个页面,这2个页面的结构相同,只是每个列表的行数和内容有所不同,要保证滚动条拖动的时候,这两个页面同步向下滚动,从而比较清楚的进行差异对比。其实最主要的就是每个列表要保证同样高度。
具体的实现代码如下:
frame2.html:
<script language=javascript>
var listA1= parent.frame1.document.getElementById("envionmentList") ;
var listB1=document.getElementById("envionmentList");
setListHeight (listA1,listB1);
var listA2= parent.frame1.document.getElementById("stafferList") ;
var listB2=document.getElementById("stafferList");
setListHeight (listA2,listB2);
var listA3= parent.frame1.document.getElementById("scheduleList") ;
var listB3=document.getElementById("scheduleList");
setListHeight (listA3,listB3);
var listA4= parent.frame1.document.getElementById("riskList") ;
var listB4=document.getElementById("riskList");
setListHeight (listA4,listB4);
var listA5= parent.frame1.document.getElementById("configList") ;
var listB5=document.getElementById("configList");
setListHeight (listA5,listB5);
function setListHeight(aList,bList)
{
a= aList.clientHeight;
b= bList.clientHeight ;
if(a>b)
{
var row =(a-b ) /20;
for(var j=0;j<row; j++)
{
var tr1 = document.createElement("tr");
var td1 = document.createElement("td");
var tn = document.createTextNode(".");
td1.appendChild(tn);
tr1.appendChild(td1);
bList.childNodes[0].appendChild(tr1);
}
}
else
{
var row =(b-a )/20;
for(var j=0;j<row; j++)
{
var doc=parent.frame1.document;
var tr1 = doc.createElement("tr");
var td1 = doc.createElement("td");
var tn = doc.createTextNode(".");
td1.appendChild(tn);
tr1.appendChild(td1);
doc.getElementById("riskList").childNodes[0].appendChild(tr1);
}
}
}
function scrollIt() {
parent.frame1.document.body.scrollTop = document.body.scrollTop;
}
with (window) {
onscroll = onsize = scrollIt;
}
</script>