1、iframe中的src属性和iframe当前url一致吗
iframe默认加载src属性的url,但是如果iframe内部发生跳转,当前url并不会同步到src属性上
2、iframe如何监听iframe的url变化
(1)onload
iframe每次重新加载页面时都会触发onload方法
iframe.onload = function (e) {
//
}
(2)监听iframe属性变化
使用MutationObserver监听iframe的src属性变化,需注意的是如果是iframe内部执行的方法导致url变化则不会触发src属性变化
var MutationObserver = window.MutationObserver || window.WebKitMutationObserver || window.MozMutationObserver;
var observer = new MutationObserver(items => {
items.forEach(item =>{
console.error(item)
iframeChange(item.oldValue, item.target.src, item.target)
})
})
var options = {
attributes: true, // 属性
attributeFilter: ["src"] // 表示需要观察的属性
}
observer.observe(Iframe, options);
function iframeChange(oldValue, newValue, iframeData){
console.log("旧地址:"+oldValue)
console.log("新地址:"+newValue)
}
3、获取iframe当前url
通过contentWindow获取
iframe.contentWindow.location.href
但是对于iframe和页面有跨域的 , 是无法获取到contentWindow.location.href的
4、对于Chrome中如果页面加载失败,Window.location.href无法获取到实际访问的目标链接,但是可以通过以下方法获取
Iframe.contentWindow.loadTimeData && SSOIframe.contentWindow.loadTimeData.data_.summary.failedUrl
或
window.document.querySelector('#reload-button').url