將文本插入文本區域

Question

我如何將頁面加載中的文本插入此文本區域：

<textarea name="orderNotes" cols="115" rows="3"></textarea>

我嘗試過：

var myTextarea = document.getElementsByClassName('orderNotes');
console.log(myTextarea);
myTextarea.value += "text to add to the textarea";

HTML：

<textarea name="orderNotes" cols="115" rows="3"></textarea>

Answer 1

如果您訪問getElementsByTagName()返回的數組的[0]元素，並將class屬性添加到標記中，則您的js代碼應該可以工作。

var myTextarea = document.getElementsByClassName('orderNotes')[0];
myTextarea.value += "text to add to the textarea";

<textarea name="orderNotes" class="orderNotes" cols="115" rows="3"></textarea>

但是更安全的方法是設置id屬性，並使用getElementById()而不是getElementsByClassName() 。

var myTextarea = document.getElementById('orderNotes');
myTextarea.value += "text to add to the textarea";

<textarea name="orderNotes" id="orderNotes" cols="115" rows="3"></textarea>

Answer 2

您根本沒有給您的<textarea>任何類，因此.getElementsByClassName()除非您這樣做，否則將無用：

<textarea name="orderNotes" class="orderNotes">

完成此操作后，您將不得不處理.getElementsByClassName()返回元素列表 ，而不僅僅是一個元素的事實。

var myTextarea = document.getElementsByClassName('orderNotes')[0];

這會將您的變量設置為找到的第一個變量。 如果要唯一地標識該<textarea> ，則可以為其指定一個ID：

<textarea name="orderNotes" id="orderNotes">

然后使用.getElementById() ，它僅返回一個元素（或不返回任何元素）：

var myTextarea = document.getElementById("orderNotes");

Answer 3

您正在嘗試通過類名稱進行選擇，這需要使用html class屬性。 您可以在此處使用querySelector來按屬性名稱獲取。

var myTextarea = document.querySelector("textarea[name='orderNotes']");

Answer 4

使用Javascript的基本示例：

 var textArea = document.myform.inputtext.value; textArea += "your text"; document.myform.inputtext.value = textArea; 

 <form name="myform"> <textarea name="inputtext"></textarea> </form> 

Answer 5

document.getElementByClassName返回項目數組，因為更多對象可以共享該類。 因此，您應該通過其索引（myTextarea [0] .value-您知道它是此類的唯一元素）來訪問它，或者更好地使用id並通過document.getElementById（'id'）訪問它：

javascript：

var myTextarea = document.getElementsById('orderNotes');
consol.log(myTextarea);
myTextarea.value += "text to add to the textarea";

的HTML：

<textarea id="orderNotes" cols="115" rows="3"></textarea>