如何解决如何用textarea更改段落
因此,我是Web开发领域的新手,我想创建一个可以通过textarea更改其textContent的段落。我的意思是:如果我要写“ Hello World!”在textarea中,我希望将段落的内容更改为文本,即写在文本框中。当然使用JavaScript。但我不知道该怎么做。我做了一些尝试,但都失败了。 这是我的HTML,我需要JavaScript导师...
src
和我创建的变量:
<p class="test-text"></p>
<textarea class="tarea" name="textarea" cols="30" rows="10"></textarea>
你们可以帮我吗:D
解决方法
我会同时给两个ID,这样您就可以更轻松地获得它们。使用类名可能会起作用,但是如果您要创建该类的另一个元素,则将不起作用。而且,如果仅使用类来标识元素,则无论如何都应使用id,因为这是它们的用途。然后看起来像这样:
<p class="test-text" id="myParagraph"></p>
<textarea class="tarea" id="myTextarea" name="textarea" cols="30" rows="10"></textarea>
然后,您可以使用以下命令简单地设置textArea:
var text = document.getElementById("myParagraph").textContent;
document.getElementById('myTextarea').value = text;
请注意,只有在段落标记内没有其他元素的情况下,textContent才可以正常工作。否则,基础元素的textContent应该包含在段落元素的textContent中。
,首先,您需要获取元素:
HTML:
<p id="text" class="test-text"></p>
<textarea id="text-area" class="tarea" name="textarea" cols="30" rows="10"></textarea>
JS:
var paragraph = document.querySelector('#text');
var tarea = document.querySelector('#text-area');
我为元素添加了ID
然后,您需要向文本区域添加事件侦听器:
tarea.addEventListener('input',updateValue);
现在,您可以创建一个函数来更新段落:
function updateValue(e) {
paragraph.textContent = e.target.value;
}
请注意,当您在文本区域中键入内容时,将执行updateValue
您可以检查this以获得更多信息
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。