javascript：正確使用insertBefore（）

我已經創建了javascript程序，我已經在body和prompt中創建了div標籤，以便接受來自用戶的文本之後，我創建了div並希望將提示文本添加到div。新的div應該在創建之前顯示，爲此我已經使用了insertBefore（）。我試圖在控制檯中獲取值，並在控制檯中獲取值。但是我的程序沒有按照預期工作。javascript：正確使用insertBefore（）

代碼：

<!DOCTYPE html> 
<html> 
<head> 
    <title>trail</title> 
    <meta charset="utf-8"> 
    <style type="text/css"> 

    .pink{ 
     background-color: pink;  
    } 

    .green{ 
     background-color: #71e887; 
    } 

    </style> 

    <script type="text/javascript"> 
    var movieText = prompt("What movie do you like?"); 

    var newDiv = document.createElement("div"); 
    parent = newDiv.parentNode; 
    newDiv.className = "green"; 

    var text = document.createTextNode(movieText + " is a good movie"); 

    newDiv.innerHTML = text; 
    newDiv.appendChild(text); 

    var beforeMe = document.getElementById("div1");  
    document.body.insertBefore(newDiv, beforeMe); 

    </script> 

</head> 
<body> 


<br> 

<div class="pink" id = "div1"> 
    I love watching movies <br/> 
    This is one of my favorite movie: 
</div> 

</body> 
</html>

我的輸出：

[1]

預期輸出[在這裏輸入的形象描述] [1]！]！

[進入image description here] [2]] [2]

來源

2017-10-06 pari

刪除'newDiv.innerHTML = text;' –

@JaromandaX但需要使用innerHTML在div中添加文本。 – pari

好吧，不要這樣做...我的意思是'newDiv.appendChild（text）;'已經這樣做了，但是我會怎麼知道 –

As @pari提到，您正在使用innerHTML插入文本節點objet。該功能將對文本節點執行.toString()。這就是你收到輸出[object text]。如果你需要使用innerHTML然後就一起去.innerHTML(movieText + " is a good movie") 或者您可以使用文本節點是這樣的：

var textNode = document.createTextNode(movieText + " is a good movie"); 
newDiv.appendChild(textNode);

，但同時不要同時使用。

來源

2017-10-06 02:38:53

如何在創建div後添加br標籤？ – pari

在這裏使用appendChild你是一個例子https://jsfiddle.net/7xx7txuz/ –

javascript：正確使用insertBefore（）

回答

相關問題