收到 document.body 错误。帮助！

发布于 2024-09-18 01:19:38 字数 2722 浏览 1 评论 0原文

我有以下 JavaScript 代码：

function createNotification(title, body, canDismiss, callback)
{
    //create the container
    var nContainer = document.createElement("div");
    nContainer.setAttribute("id", "note"+title);
    nContainer.setAttribute("class","nContainer");
    nContainer.className = "nContainer";

    //create the title
    var nTitle = document.createElement("div");
    nTitle.setAttribute("class", "nTitle");
    nTitle.className = "nTitle";
    nTitle.innerHTML = title;

    //if canDismiss is true then add controls
    if (canDismiss)
    {
        var nDismiss = document.createElement("div");
        nDismiss.setAttribute("class", "nDismiss");
        nDismiss.className = "nDismiss";
        nDismiss.innerHTML = "[close]";
        nDismiss.onclick = function(){destroyNotification(title);callback();};
        nTitle.appendChild(nDismiss);

    }

    //append the title to the container
    nContainer.appendChild(nTitle);

    //create the body and append to container
    var nBody = document.createElement("div");
    nBody.setAttribute("class", "nBody");
    nBody.className = "nBody";
    nBody.innerHTML = body;
    nContainer.appendChild(nBody);

    document.body.appendChild(nContainer);

    //fade background
    fadeIt(title);
}

function destroyNotification(title)
{
    //get the specified notification
    var note = document.getElementById("note"+title);

    //remove the notification
    document.body.removeChild(note);

    //unfade the background
    unfadeIt(title)
}

function fadeIt(title)
{
    //create a partially opaque div and append it to the document
    var Fade = document.createElement("div");
    Fade.setAttribute("id", "fade"+title);
    Fade.setAttribute("class","fade");
    Fade.className = "fade";
    document.body.appendChild(Fade);
}

function unfadeIt(title)
{
    //get the specified fade element
    var Fade = document.getElementById("fade"+title);

    //remove the specified fade element
    document.body.removeChild(Fade);
}

我收到 document.body 错误。有人可以帮忙吗？

这是 html：

<html>
<head>
<title></title>
<script langauge="javascript" type="text/javascript" src="notification.js"> </script>
<link rel="stylesheet" type="text/css" href="notification.css" /> 
<script language="javascript" type="text/javascript">

createNotification("The Title", "Some sort of message for our body", true, function(){alert("A Callback");});


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

我从 firebug 得到的错误是：

document.body 为空
[中断此错误] document.body.appendChild(nContainer);

原文

I have the following JavaScript code:

function createNotification(title, body, canDismiss, callback)
{
    //create the container
    var nContainer = document.createElement("div");
    nContainer.setAttribute("id", "note"+title);
    nContainer.setAttribute("class","nContainer");
    nContainer.className = "nContainer";

    //create the title
    var nTitle = document.createElement("div");
    nTitle.setAttribute("class", "nTitle");
    nTitle.className = "nTitle";
    nTitle.innerHTML = title;

    //if canDismiss is true then add controls
    if (canDismiss)
    {
        var nDismiss = document.createElement("div");
        nDismiss.setAttribute("class", "nDismiss");
        nDismiss.className = "nDismiss";
        nDismiss.innerHTML = "[close]";
        nDismiss.onclick = function(){destroyNotification(title);callback();};
        nTitle.appendChild(nDismiss);

    }

    //append the title to the container
    nContainer.appendChild(nTitle);

    //create the body and append to container
    var nBody = document.createElement("div");
    nBody.setAttribute("class", "nBody");
    nBody.className = "nBody";
    nBody.innerHTML = body;
    nContainer.appendChild(nBody);

    document.body.appendChild(nContainer);

    //fade background
    fadeIt(title);
}

function destroyNotification(title)
{
    //get the specified notification
    var note = document.getElementById("note"+title);

    //remove the notification
    document.body.removeChild(note);

    //unfade the background
    unfadeIt(title)
}

function fadeIt(title)
{
    //create a partially opaque div and append it to the document
    var Fade = document.createElement("div");
    Fade.setAttribute("id", "fade"+title);
    Fade.setAttribute("class","fade");
    Fade.className = "fade";
    document.body.appendChild(Fade);
}

function unfadeIt(title)
{
    //get the specified fade element
    var Fade = document.getElementById("fade"+title);

    //remove the specified fade element
    document.body.removeChild(Fade);
}

I am getting a document.body error. Can anyone please help?

This is the html:

<html>
<head>
<title></title>
<script langauge="javascript" type="text/javascript" src="notification.js"> </script>
<link rel="stylesheet" type="text/css" href="notification.css" /> 
<script language="javascript" type="text/javascript">

createNotification("The Title", "Some sort of message for our body", true, function(){alert("A Callback");});


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

The error I got from firebug is:

document.body is null
[Break on this error] document.body.appendChild(nContainer);

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

夜巴黎 2024-09-25 01:19:39

您甚至在页面加载之前就执行了 createNotification 函数。当您调用 body 元素时，它甚至不存在。

调用页面底部的函数或添加加载事件[link]。

回复收藏 0 原文

乖乖兔^ω^ 2024-09-25 01:19:39

文档对象有属性“body”。

document.getElementsByTagName("body")[0].removeChild(note);

There is property "body" for document object.

document.getElementsByTagName("body")[0].removeChild(note);

回复收藏 0 原文

蹲在坟头点根烟 2024-09-25 01:19:39

你什么时候执行你的代码？我的意思是，这些方法何时被调用：在文档加载之后还是之前的某个地方？另外，我无法理解 createNotification 中的一行代码：

function nBody.innerHTML = body;

您可以在 body 标记而不是 head 标记内调用此方法吗？或者您可以使用 window.onload 事件来调用此函数吗？

When are you executing your code? I mean, when are the methods getting called: after the document has loaded or somewhere before? Also I could not understand one line of code in createNotification: