书签脚本：如何使用Javascript将文本插入到文本区域？

Question

我做错了什么？

 javascript:document.getElementsByTagName('textarea').innerHTML='inserted';

我想创建一个书签脚本，可以在指定网页的文本区域中插入简单的文本。

- matt

Answer 1

使用value属性而不是innerHTML，并确保您的代码评估为undefined，可以通过将其包装在没有return语句的函数中来实现。如果您不这样做，页面的内容将被替换为您的代码评估为什么（在本例中为字符串“inserted”）。

javascript:(function() {document.getElementsByTagName('textarea')[0].value = 'inserted';})();

2012年1月14日更新

我没有注意到原始代码将document.getElementsByTagName('textarea')视为单个元素而不是它实际上的NodeList，因此我已经用[0]更新了我的代码。@streetpc的回答更详细地解释了这一点。

- Tim Down

---

下投票的人：我猜你之所以给这个贴子点了踩，是因为我忽略了原始代码把 document.getElementsByTagName('textarea') 当作一个单一元素来处理的事实。这是公平的，但是留下评论指出这一点会更有帮助。 - Tim Down

Answer 2

与getElementById不同，getElementsByTagName在Elements上有一个s，因为它返回匹配元素的类似数组的节点列表。所以你需要先访问其中的一个元素，比如说第一个元素：

javascript:void((function(){document.getElementsByTagName('textarea')[0].value='inserted'})())

另外，正如其他人所提到的，这里使用value属性而不是innerHTML。

- instanceof me

---

实际上，getElementsByTagName() 返回的是类似数组的 NodeList 而不是数组，但你的观点是正确的。 - Tim Down

Answer 3

如果有人想知道如何使用当前聚焦的文本字段，请使用以下方法：

document.activeElement.value = "...";

- robinst

Answer 4

在jQuery中，您必须以以下方式使用：

对于单个元素 -> $('#element_id').html('your html here') 对于所有文本区域 -> $('textarea').val('your html here')

我必须承认，我不确定为什么它是这样工作的，但它确实有效。并且使用框架，它们将节省您的时间和神经。

- Ilian Iliev

---

@Antonio 是的，您可以通过将脚本标签附加到文档中来加载任何脚本。例如：http://benalman.com/projects/run-jquery-code-bookmarklet/ - meleyal

@meleyal，我认为这很冒险：如果页面中已经使用了jQuery，可能会出现jQuery版本冲突。 - Anthony

@Antonio，你可以使用.noConflict()来运行：https://api.jquery.com/jQuery.noConflict/ - meleyal