如何从动态生成的 iframe 中删除 onload 事件?
Posted
技术标签:
【中文标题】如何从动态生成的 iframe 中删除 onload 事件?【英文标题】:How to remove onload event from the dynamically generated iframe? 【发布时间】:2018-01-18 20:13:15 【问题描述】:<div class="voc_container content-container">
<div class="voc_content">
<h3 class="heading-small">Tell us what you think of this page</h3>
<span class="voc_content_open">Take a short survey to give us your feedback</span>
<span class="voc_content_close js-hidden">Close</span>
<div class="voc_content_survey js-hidden">
<script id="ss-embed-380173">
(function (d, w)
var s, ss;
ss = d.createElement('script');
ss.type = 'text/javascript';
ss.async = true;
ss.src = ('https:' == d.location.protocol ? 'https://' : 'http://') +
'www.xxxxxx.co.uk/s/r/embed.aspx?i=341674&c=380173';
;
s = d.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ss,
s); )(document, window);</script></div>
</div>
</div>**strong text**
生成html为
<iframe id="ss-embed-frame-380173"
src="https://www.xxxxxxx.co.uk/s/YEXFX/" frameborder="0" style="border:
0px currentColor; border-image: none; width: 100%; height: 400px; padding-
bottom: 4px;" onload="window.scrollTo(0, document.getElementById('ss-embed-
frame-380173').offsetTop);"><a
href="https://www.xxxxxxx.co.uk/s/YEXFX/">Please take our
survey</a></iframe>
我尝试使用 createelement 删除列表器
ss.removeEventListener("onload","window.scrollTo(0,
document.getElementById('ss-embed-frame-380173').offsetTop);");
ss.onload=function()
从动态生成的事件中删除 onload 事件,但不会删除。
谁能帮助我指导如何从动态生成的 iframe 元素中删除 onload 事件???
onload="window.scrollTo(0, document.getElementById('ss-embed-
frame-380173').offsetTop);
【问题讨论】:
【参考方案1】:你可以使用 jQuery。
<script type="text/javascript">
$("#ss-embed-frame-380173").removeAttr("onload");
</script>
【讨论】:
【参考方案2】:您可以使用MutationObserver
来观察添加到document
的元素,如果id
或其他选择器匹配,则在元素上调用.removeAttribute("onload")
,.disconnect()
观察者实例
<!DOCTYPE html>
<html>
<head>
<script>
const config =
childList: true,
subtree: true
;
const observer = new MutationObserver(function(mutations)
mutations.forEach(function(mutation)
mutation.addedNodes.forEach(function(node)
if (new RegExp("^ss-embed-frame").test(node.id))
node.removeAttribute("onload");
observer.disconnect();
console.log(node.getAttribute("onload"), node.outerHTML);
)
)
)
observer.observe(document.documentElement, config);
</script>
<script>
let iframe = `<iframe id="ss-embed-frame-380173"
src="data:text/plain,abc" frameborder="0" style="border:
0px currentColor; border-image: none; width: 100%; height: 400px; padding-
bottom: 4px;" onload="window.scrollTo(0, document.getElementById('ss-embed-
frame-380173').offsetTop);"><a
href="https://www.xxxxxxx.co.uk/s/YEXFX/">Please take our
survey</a></iframe>`;
onload = function()
document.body.innerHTML += iframe
;
</script>
</head>
<body>
</body>
</html>
【讨论】:
以上是关于如何从动态生成的 iframe 中删除 onload 事件?的主要内容,如果未能解决你的问题,请参考以下文章
如何使用 Behat/Mink 切换到动态命名的 iframe
如何让 angularJS 动态内容显示在 iframe 中?