第一类: iframe逐个加载
updateIframeSrc(index = 0) {
let srcLen = this.srcArr.length;
if (index == srcLen) {
return false;
} else {
var iframe = document.createElement("iframe");
iframe.id = this.srcArr[index]["name"];
iframe.src = this.srcArr[index]["src"];
iframe.width = "100%";
iframe.height = "200";
iframe.style.borderWidth = "0";
if (iframe.attachEvent) {
//IE
iframe.attachEvent("onload", () => {
index++;
this.updateIframeSrc(index);
});
} else {
//not IE
iframe.onload = () => {
index++;
this.updateIframeSrc(index);
};
}
let _iframeBox = $(`<div class="col-md-3 iframe-box"></div>`);
$("#app").append(_iframeBox.html(iframe));
}
效果是,iframe逐个加载
参考链接:https://blog.csdn.net/tree3170/article/details/8279249
第二类:需要点击事件,显示对应的iframe
https://codegena.com/light-iframe-embeds/