将文本插入文本区域

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>