Question

我对innerHTML和getElementsById（）有疑问;方法，但我不确定这两种方法是否是我所遇问题的根源。

这里是我的代码：

<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>

因此，理论上，此代码将从textarea获取用户输入并替换<p>标记之间的文本。它实际上工作了半秒钟：我看到文本迅速改变为用户在textarea中放置的内容，<p>标记之间的文本被来自<textarea>的用户输入替换，并立即返回到原文。

之后，当我检查源代码时，html代码没有改变一点，因为html应该被textarea的任何用户输入所取代。

我尝试了三种不同的broswer，我也尝试过使用getElementByTagName（）;方法没有成功。

我错过了什么吗？我的代码似乎合法而干净，但有些东西正在逃避我的掌握。

我想要的代码是用textarea中的用户输入替换给定标记（如<p>）之间的HTML代码，但它只替换它几毫秒并返回原始html。

任何帮助将不胜感激。

编辑：我想在html页面添加文字。更改页面上可见的文本。不一定在源头。。。

Answer 1

没有document.getElementsById，但是document.getElementById。这可能是你问题的根源。

Answer 2

我认为没有任何document.getElementsById功能。它应该是document.getElementById。

Answer 3

“要设置或获取input或textarea元素的文本值，请使用.val（）方法。”

查看jquery网站... http://api.jquery.com/val/

Javascript形成innerHTML

3 个答案: