IE、FF兼容 iframe 截取页面某坐标的内容

来源:互联网 发布:淘宝店铺的微淘在哪里 编辑:程序博客网 时间:2024/06/01 10:35


先来熟悉下,Iframe的一些属性:
  1. marginheight 属性规定框架内容与框架的上方和下方之间的高度,以像素计。
  2. maiginweidth 属性规定框架内容与框架的左侧和右侧之间的高度,以像素计。
  3. vspace y方向显示的区域,负值为从目标网页最上面开始截取的部分,正值为y值+从上部开始内容区域
  4. hsapce x方向显示的区域,负值为从目标网页左侧开始截图的部分,正值为x值+从左侧开始内如区域
  5. src 目标网页的地址,可以为html,asp,文本等内如
  6. frameborder 框架边框,0为无边框(画中画效果)
  7. scrolling 是否显示滚动,yes显示
  8. align:指定浮动窗口内的页面相对于浮动窗口的位置,它的值有left、right、top、middle、bottom
  9. marginwidth、marginheight 目标网页被框架覆盖的深度


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>
<body onload="f()">
<script type="text/javascript">
function f(){
var el = document.createElement("iframe");
el.setAttribute('id', 'ifrm');
document.body.appendChild(el);
el.setAttribute('src', 'http://www.XXX.com#aad');


        if (document.all){//IE
                el = document.frames["ifrm"].document;
        }else{//Firefox    
                el = document.getElementById("ifrm").contentDocument;
        }

        doc.getElementById("aad").style.color="blue";
}
</script>
</body>
</html>

找了很久的呀,单用<iframe src="http://www.XXX.com#aad/" width="200" height="500"> 这个代码,在FF里面是可以正常显示的,但是到了IE可就不对了,坐标完全没有定位到。 (注:#aad为需要的div层的id=“aad”)

用iframe截取虽然可以实现需要的效果,但是浏览器还是会先把整个网页下载完成,然后才定位,网速慢的话,这一点就特别明显。

所以并不推荐使用iframe.

0 0