嗨,我需要您的帮助我是javascript或jquery的新手,他们试图在overlay元素内添加html代码,但使用$(“ overlay”).append(“ Hello”)不能正常工作。这一个,但不起作用

下面的js输出我想做的就是在其中输入一个html代码

 init=()=>{
        //SELECT & BIND (CLICK) EVENT
        document.querySelector('a.menuToggle, a#welcomeDivs').addEventListener('click',modal.overlay.init);
    }
    modal={
        overlay:{
            init:()=>{
                //CREATE OVERLAY
                var overlay = document.createElement('overlay');
                overlay.id = 'welcomeDivsss';
                //SET (CLICK) EVENT TO REMOVE ITSLEF
                overlay.addEventListener('click',modal.overlay.remove);
            $( "overlay" ).append( "<strong>Hello</strong>" );

                //APPEND TO INTERFACE
                document.body.appendChild(overlay);

            },
            remove:(e)=>{
                //REMOVE ITSELF
                e.target.parentNode.removeChild(e.target);
            }
        }
    }

    //ON DOCUMENT LOAD RUN INIT
    document.addEventListener('DOMContentLoaded',init);

最佳答案

您正在尝试将html附加到叠加层,然后再附加到正文。
以下是更新的代码。

 init=()=>{
        //SELECT & BIND (CLICK) EVENT
        document.querySelector('a.menuToggle, a#welcomeDivs').addEventListener('click',modal.overlay.init);
    }
    modal={
        overlay:{
            init:()=>{
                //CREATE OVERLAY
                var overlay = document.createElement('overlay');
                overlay.id = 'welcomeDivsss';
                //SET (CLICK) EVENT TO REMOVE ITSLEF
                overlay.addEventListener('click',modal.overlay.remove);

                //APPEND TO INTERFACE
                document.body.appendChild(overlay);

                // After overlay added to html. "welcomeDivsss" is overlay id you specified.
                $( "#welcomeDivsss" ).append( "<strong>Hello</strong>" );

            },
            remove:(e)=>{
                //REMOVE ITSELF
                e.target.parentNode.removeChild(e.target);
            }
        }
    }

    //ON DOCUMENT LOAD RUN INIT
    document.addEventListener('DOMContentLoaded',init);

07-24 09:48
查看更多