在 html 元素中添加子元素

问题描述 投票:0回答:1

我从另一个文件生成一个

div
并返回它

export function createLayout(obj, obj2) {
const div = document.createElement("div");
///
code
///
return div
}

然后,在另一个文件中,我创建一个节元素,并希望通过appendChild将生成的元素添加到其中,但出现错误 Uncaught TypeError: Failed toexecute 'appendChild' on 'Node':parameter 1 is not of type '节点'。我尝试通过 InnerHtml 来做到这一点,但它没有做任何事情。

javascript append appendchild
1个回答
0
投票

问题是你没有等待div存在于dom上,然后再注入另一个元素检查我做的这个例子

(() => {
    const createDiv = () => {
        return  document.createElement('div');
    }

    const createSection = () => {
        const section = document.createElement('section');
        section.textContent = 'hello world';
        return section;
    }

    const init = () => {
        const refElement = document.getElementById('magic');

        
        const div = createDiv();

        refElement.appendChild(div);

        const section = createSection();

        div.appendChild(section);
    }

    init();
})();
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>

    <div id="magic"></div>
    
    <script src="./script.js">

    </script>
</body>
</html>

© www.soinside.com 2019 - 2024. All rights reserved.