Javascript form innerHTML

我對innerHTML和getElementsById（）有問題;方法，但我不確定這兩種方法是否是我擁有的問題的根源。Javascript form innerHTML

在這裏不用我的代碼：

<script type="text/javascript"> 

    function clearTextField(){ 
     document.getElementsById("commentText").value = ""; 
    }; 

    function sendComment(){ 
     var commentaire = document.getElementById("commentText").value; 
     var htmlPresent = document.getElementById("posted"); 

     htmlPresent.innerHTML = commentaire; 
     clearTextField(); 
    }; 
</script>

和我的HTML代碼是這樣的：

<!doctype html> 
<html> 
<head></head> 
    <body> 

    <p id="posted"> 
    Text to replaced when user click Send a comment button 
    </p> 

    <form> 

    <textarea id="commentText" type="text" name="comment" rows="10" cols="40"></textarea> 
    <button id="send" onclick="sendComment()">Send a comment</button> 

    </form> 
    </body> 
</html>

所以theorically，該代碼將得到textarea的用戶輸入和替換的文本<p>標記。它實際上工作了半秒鐘：我看到文本迅速改變爲用戶在textarea中放置的內容，<p>標記之間的文本被來自<textarea>的用戶輸入替換，並且它立即回到原始文本。

之後，當我檢查源代碼時，html代碼沒有改變一點，因爲html應該已經被textarea的任何用戶輸入所取代。

我嘗試過三種不同的瀏覽器，我也嘗試過使用getElementByTagName（）;方法沒有成功。

我想念什麼？我的代碼似乎合法且乾淨，但有些東西正在逃離我的掌握。

我想要的代碼是用textarea中的用戶輸入替換給定標記（如<p>）之間的HTML代碼，但它只替換它幾毫秒並返回到原始html。

任何幫助，將不勝感激。

編輯：我想添加文本到html頁面。改變頁面上可見的文字。不一定在源頭上。。。

來源

2012-09-12 user1621223

你是如何「檢查源代碼」？ – ggreiner

請看看這篇文章：http://stackoverflow.com/questions/6390832/javascript-innerhtml-does-not-change-content-on-source-code – Chase

@ggreiner - 我按ctrl + u在我的瀏覽器。 – user1621223