Javascript 如何在页面加载时加载放大弹出模式

我试图在页面加载时加载我的放大弹出模式，但是我不能完全理解文档中的语法。如何调用页面加载时的模式

我的HTML：

<div id="test-modal" class"white-popup-block mfp-hide">
    <h1>Modal Test</h1>
    <p>
    Test Some text.
    </p>
    <p>
    <a class="popup-modal-dismiss">Dismiss</a>
    </p>
</div>

我已经预装了脚本和css文件，我应该在JS中键入什么才能让它加载弹出窗口？

试试这个：

$.magnificPopup.open({
    items: {
        src: '<div id="test-modal" class="white-popup"><h1>Modal Test</h1><p>Test Some text.</p><p><a class="popup-modal-dismiss">Dismiss</a></p></div>',
        type:'inline'
    },
    modal: true
});

$.magnificpoop.open({
项目：{
src:“模态测试测试一些文本。
..
您可以尝试以下方法：

    $.magnificPopup.open({
        items: {
            src: 'images/loading.gif',
            type:'image'
        },
        modal: true
    });

有没有办法用现有的标记打开弹出窗口？我已经有了DOM元素设置，我只想用JavaScript打开弹出窗口。
$.magnificPopup.open({items: {src: '#id-of-your-popup'},type: 'inline'}, 0);

    $.magnificPopup.open({
        items: {
            src: 'images/loading.gif',
            type:'image'
        },
        modal: true
    });