如何使用纯 javascript 定位文本区域标记中的占位符值

Question

我目前有一个 div 名为 comp

<div id="comp"></div>

使用 Javascript，我添加了一个带有占位符值的文本区域标签

var comp = document.getElementById('comp');
setTimeout(function(){
        comp.innerHTML = '<textarea placeholder="Write on me now, or else... you will have to watch me write on"></textarea>';
    }, 1500);

请记住，逐字写出整个文本大约需要 1.5 秒。

如何使用 setInterval 每 200 毫秒将单词 "and on" 附加到 textarea 中的占位符值，以便每隔 .2 秒 "and on" 不断写入，直到用户写入内容。

请随时查看此 JSFiddle 以进行澄清。（美学有点混乱，但它完成了工作）。谢谢，我真的很感激！

另外，我试过寻找类似的问题，但一直找不到。如果有人将我引向他们，那将真的很有帮助。

Answer 1

虽然我不太明白你想要什么，但我认为你想要的是：

var textarea = document.getElementById('test');
setInterval(function () {
    textarea.placeholder += ' and on';
}, 1500);

<div id="comp"><textarea id='test' placeholder="Write on me now, or else... you will have to watch me write on"></textarea></div>

每 1.5 秒，将 and on 添加到 ID 为 test

的文本区域的占位符中

Answer 2

您可以使用 getElementsByTagName 获取对文本区域的引用，然后启动一个将文本添加到占位符的间隔。当用户开始输入时，您可能希望停止间隔：

setTimeout(function(){
  var comp = document.getElementById('comp');
  comp.innerHTML = '<textarea placeholder="Write on me now, or else... you will have to watch me write on"></textarea>';
  var tex = comp.getElementsByTagName('textarea')[0];
  var handle = window.setInterval(function(){
    if (tex.value.length == 0) {
      tex.placeholder += ' and on';
    } else {
      window.clearInterval(handle);
    }
  }, 200);
}, 1500);

textarea { width: 90%; height: 200px; }

<div id="comp"></div>

此外，您可能想添加一个计数器（或只检查占位符的长度），以便在一定次数后停止间隔。如果无限期地打开间隔，浏览器最终会崩溃。

如何使用纯 javascript 定位文本区域标记中的占位符值

How does one target a placeholder value in a textarea tag using pure javascript

javascript

append

textarea

placeholder