[英]jQuery – Parse iframe inserted after page load
我是jQuery新手,遇到了一些麻烦。 一个页面在页面加载后插入了iframe
。 我需要在iframe
的内容中找到锚链接,并将其href
与URL进行比较。 仅尝试使用纯JavaScript getElementById()
无效,因为在加载后插入了iframe
。 我读到我应该使用jQuery的live()
, delegate()
或on()
,但是我不确定它们如何工作。 另外,如果有一个纯Javascript解决方案也很棒。
我需要解析的iframe
是:
<iframe src="http://assets.tumblr.com/iframe.html?10&src=http%3A%2F%2Fstaff.tumblr.com%2F&lang=en_US&name=staff"
scrolling="no" width="330" height="25" frameborder="0"
style="position:absolute; z-index:1337; top:0px; right:0px;
border:0px; background-color:transparent; overflow:hidden;"
id="tumblr_controls">
</iframe>
它被附加到每个Tumblr博客(请参阅Tumblr Staff Blog )。
我感兴趣的iframe内容部分如下所示:
<div style="position:absolute; top:3px; right:3px; white-space:nowrap; height:20px;">
<form action="/follow" method="post" style="display:block; float:left;" onsubmit="_gaq.push(['_trackEvent', 'Iframe', 'Follow', 'staff');">
<input type="hidden" name="form_key" value="8W0r1XnbOEtpTF0q8oe96BmGMJg"/>
<input type="hidden" name="id" value="staff"/>
<input type="image" src="http://assets.tumblr.com/images/iframe_follow_alpha.png 1018" style="width:58px; height:20px; border-width:0px; display:block; margin-left:3px; cursor:pointer;" alt="Follow"/>
</form>
<a target="_top" href="http://www.tumblr.com/dashboard">
<img src="http://assets.tumblr.com/images/iframe_dashboard_alpha.png?1018" alt="Dashboard" style="height:20px; width:81px; border-width:0px; display:block; float:left; cursor:pointer;"/>
</a>
我需要比较此内容中所有可能的锚链接,并将它们的hrefs与URL进行比较。
function getHref() {
var src = false,
iframe = $('iframe#tumblr_controls'); // keep reference of iframe;
// check that iframe loaded
if( iframe.length) {
src = iframe.find('a[target=_top]').attr('href');
}
}
现在,您可以调用getHref()
来获取iframe中链接的href
,并将其用于比较。
您也可以尝试如下操作:
$('iframe#tumblr_controls').load(function() {
var href = $(this).find('a[target=_top]').attr('href');
});
如果您有多个a
内容中的标记,然后尝试:
function compareHrefs() {
var iframe = $('iframe#tumblr_controls'); // keep reference of iframe;
// check that iframe loaded
if( iframe.length) {
// looping over each tag
iframe.find('a').each(function() {
if ( this.href == TARGET_URL ) {
// do something
}
});
}
}
插入iframe后,您可以像在jquery中一样从其ID获取iframe
$('#tumblr_controls')
并获取源URL,只需使用jquery的attr
var source = $('#tumblr_controls').attr('src');
jsfiddle.net上的工作演示
您的iframe是另一个文档,因此您应该将其视为……
$(document).ready(function(){
$("#iframe).load(function(){
//do stuff
})
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.