Window.open() 打开模态窗如何修改标题

梦凡尘

于 2024-05-26 17:11:42 发布

阅读量283

点赞数 3

文章标签：前端 javascript html

本文链接：https://blog.csdn.net/qq_43225508/article/details/139217132

版权

当使用Window.open()以模态窗形态打开新页面时。我们只需要将Window.open()的第三个参数中添加“popup=yes”即可。在第三个参数中还可以设置宽高等属性。

如果想要可以修改标题，则需要在Window.open()打开的模态窗中内嵌Iframe 属性

        windowFeatures = `width=${myLink.width},height=${myLink.height},popup=yes`;
        const newWindow = window.open(url, openMode, windowFeatures) as any;
        newWindow.document.title = myLink.title;
        const iframe = document.createElement('iframe');
        iframe.src = myLink.url;
        iframe.style.width = '100%';
        iframe.style.height = '100vh';
        iframe.style.margin = '0';
        iframe.style.padding = '0';
        iframe.style.overflow = 'hidden';
        iframe.style.border = 'none';
        newWindow.document.body.style.margin = '0';
        newWindow.document.body.appendChild(iframe);

当然如果觉得Window.open()打开的原生弹窗样式不好看，可以用组件库中的弹窗组件。然后内嵌iframe即可.