為什么不能將Child追加到指定的DIV？

Question

在某些情況下，我可以使用appendChild（）將其添加到div中，但在其他情況下，它不起作用，並且我試圖了解原因：

作品：我還有其他代碼示例，例如以下代碼可以正常工作：

function fnAppend(){
   var oNewNode = document.createElement("LI");
   oList.appendChild(oNewNode);
   oNewNode.innerText="List node 5";
}

不起作用：我知道這是一個完全不同的示例，但是我認為區別是微妙的。 我正在從正在處理的現有項目中提取此代碼，因此無論如何我都無法更改FieldSet函數 ，而是試圖了解如何使其工作。

<html>
    <head>
        <script type="text/javascript">     
        function Fieldset() {

            this.id = "";
            this.content = document.createElement("DIV");
            this.content.id = "content";
            this.title = "Title";

            this.getFieldset = function() {
                var div = document.createElement("DIV");
                div.id = this.id;
                var span = document.createElement("SPAN");
                //var fieldset = document.createElement("DIV");
                //fieldset.id = "fieldset";
                var header = document.createElement("DIV");
                header.id = "header";
                span.appendChild(document.createTextNode(this.title));
                header.appendChild(span);
                div.appendChild(header);
                div.appendChild(this.content);
                //div.appendChild(fieldset);

                return div;
            }
        }

        var fieldset = new Fieldset();
        fieldset.id = "newid";
        fieldset.title = "new title";

        org_div1.appendChild(fieldset.getFieldset());

        </script>
    </head>
    <body onload="fieldset()">
        <div id='org_div1'> The text above has been created dynamically.</div>
    </body>
</html>

Answer 1

問題出在包含onload="fieldset()" 。 fieldset是一個對象，而不是一個函數，因此您不能直接執行它。

您可以通過將要運行的代碼包裝在函數中來獲得目標，如下所示：

function createFieldset () {
    var fieldset = new Fieldset();
    fieldset.id = "newid";
    fieldset.title = "new title";

    org_div1.appendChild(fieldset.getFieldset());
}

然后，從body標簽執行此功能，如下所示：

<body onload="createFieldset()">

應該提到兩點：

正如Steve H.提到的，您應該在使用org_div1之前對其進行初始化。 在所有瀏覽器中，依靠具有該ID的全局變量可訪問的元素並不是100％可靠的
您的代碼將新內容插入到靜態內容之前，而不是之后。 您要使用insertBefore

考慮到這兩點，我將用以下內容替換腳本的最后一行：

var org_div1 = document.getElementById("org_div1");
org_div1.parentNode.insertBefore(fieldset.getFieldset(), org_div1);

為什么不能將Child追加到指定的DIV？

問題描述

1 個解決方案

解決方案1
0 2012-06-15 02:21:28

為什么不能將Child追加到指定的DIV？

問題描述

1 個解決方案

解決方案1 0 2012-06-15 02:21:28

解決方案1
0 2012-06-15 02:21:28