问题
使用iframe.src取出的值对iframe窗口重新赋值
var iframeList = document.querySelectorAll('iframe')
for (let i = 0; i < iframeList.length; i++) {
iframeList[i].setAttribute('src', iframeList[i].src)
}
代码运行后,iframe窗口显示的都是父级页面
排查过程
1.在赋值之前将取出的值在控制台打印出来
console.log('iframe'+i,iframeList[i].src)
此时发现,控制台打印出来的地址已经是父级页面的地址了,可以排除赋值错误。 2.检查页面元素 发现iframe的src为unknown,初步锁定问题,既然src为unknown,就不能使用iframe.src的方法获取iframe窗口的地址
寻找方法
虽然src不能获取到,但页面呈现没有问题,猜想iframe的contentWindow是可以获取到的,所以在控制台输出iframe.contentWindow。发现contentWindow确实有内容。对输出内容一一查看,看到iframe的href指向是正确的。
尝试解决
将获取iframe的src的方法改成获取获取href
var iframeList = document.querySelectorAll('iframe')
for (let i = 0; i < iframeList.length; i++) {
iframeList[i].setAttribute('src', iframeList[i].contentWindow.location.href)
}
代码运行,显示正确
总结
1.修改iframe的src后需要reload刷新嵌入页面,不然页面不改变 2.修改iframe的href,其src不改变,在页面检查元素是就会出现src(unknown)的情况 综上,避免直接对href操作,修改嵌入页面,采用修改src后刷新更好。