当前位置：首页 → 问答吧 → Chorme获取iframe内节点资讯

Chorme获取iframe内节点资讯

时间：2011-08-15

来源：互联网

大家好, 小弟最近遇到了一个很奇怪的问题...
是关於iframe的读取问题, 而且只发生在chrome上...
test.html 的code如下: (各位大大可以抓到自家电脑试用)

<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=big5"/> <script src="http://code.jquery.com/jquery-latest.js"></script> <script language=javascript>
var times=0;
$(function() { $('#btn1').click(function(){
var tt=$("iframe").contents().find("body").html();
alert(tt);
});
});
function add(){
var iframe = document.getElementById("iframepage"); var win = iframe.contentWindow; var doc = win.document; if (win.getSelection()) { var node = document.createElement("span"); node.setAttribute("class",'highlightClass'); node.id=times; var selection = win.getSelection(); var range = selection.getRangeAt(0); range.surroundContents(node); } else if (doc.selection && doc.selection.createRange) { var range = doc.selection.createRange(); tag="<span class=\"highlightClass\" id=\""+times+"\">"+range.htmlText+"</span>"; range.pasteHTML(tag); } times++;
} function restore() { times--; var elements=$('#iframepage').contents().find("#"+times); element=elements; contents=element.contents(); for (j=0;j<contents.length;j++) { $(contents[j]).insertBefore(element); } element.remove(); } </script> </head> <body>
 
<iframe id="iframepage" name="iframepage" height = "95%" width = "100%" scrolling ="yes" src="main.html" frameborder="0"></iframe>
  <input type="button" value="获得原码" id="btn1" /> <input type = button value = 增加底色 onclick = "add()"> <input type = button value = 复原 onclick = "restore()"> </body>
</html>

然后是main.html 的code:

<html>
<head> <meta http-equiv="Content-Type" content="text/html; charset=big5"/>
<title>
</title>
</head>
<body> <div id="test">
<p>我是iframe结合的页面</p> 1This is a test paragraph.<br/> 2This is a test paragraph.<br/> 3This is a test paragraph.<br/> 4This is a test paragraph.<br/> 5This is a test paragraph.<br/> </div>
</body>
</html> <style> .highlightClass { background-color:yellow; } </style>

两个都各自抓下后(main.html档名一定要正确)打开test.html那个...
(很抱歉不知道哪里可以传档案, 所以只好用贴的...)
以上的原码在IE

作者: moon79221 发布时间: 2011-08-15

自问自答:
Chrome不支持本机端的异步传输行为...
故将做好的html转成Chrome的APP可以解决这样的行为,
缺点是... 每次想汇入新的页面而修改iframe的src时,
必须从APP再重新刷新一次...
看来得想办法做二次连接之类的, 自由度才有可能更高了吧!

以下是参考网站:
解决Chrome不支援本地ajax问题-> http://543.vipe.idv.tw/2011/06/chromeajax.html

作者: moon79221 发布时间: 2011-08-16

Chorme获取iframe内节点资讯

热门阅读

热门下载