隐藏 bootstrap 模态弹出窗口

Question

var webpage = require('webpage').create();
var filename = 'demo.png';
webpage.open('https://www.example.com/', function() {    
webpage.render(filename);
phantom.exit();});

在上面的代码中，当示例网站加载时，它会显示一个 bootstrap 弹出窗口。现在在 phantom js 中，我想在没有弹出窗口的情况下截取网页的屏幕截图。请帮助我如何通过 phantomjs 隐藏此弹出窗口..

Answer 1

您需要 hide/turn 在截屏之前关闭模式：

var page = require('webpage').create();
var filename = 'demo.png';
page.open('https://www.example.com/', function() {    

    // Delay script by a second to give
    // javascript some time to load and execute modal
    setTimeout(function(){

        page.evaluate(function(){
            // You'll need to find the modal id to hide it programmatically
            $('#themodal').modal('hide');
        });   

        page.render(filename);

        phantom.exit();
    }, 
    1000);

});

另一种方法是从 DOM:

中删除模态 window 元素

        page.evaluate(function(){
            // These classes are for Bootstrap 4
            $('.modal, modal-backdrop').remove();
        });

隐藏 bootstrap 模态弹出窗口

Hide bootstrap modal popup

phantomjs