将用户输入从文本框追加到新元素

appending User Input from a textbox to a new element

本文关键字:新元素 元素 追加 输入 用户 文本      更新时间:2023-09-26

我正在尝试添加一个字段供用户输入文本,并将该文本添加到我当前div 中显示的新段落元素中。

但是,我接收的是 [对象] 而不是用户输入。这是因为它还不是字符串值吗?我一直在尝试将我的对象转换为字符串,但不断返回错误。

function addText(){
    var newParagraph = document.createElement('p');
    var input = document.getElementById('userInput');
    newParagraph.className = 'red';
    newParagraph.appendChild(document.createTextNode(input));
    document.getElementById('content').appendChild(newParagraph);
}
function getText(){         
        addText();
}

我正在使用"userInput"的输入 ID 并使用 onClick = "getText()" 触发按钮上的函数。脚本工作正常,但返回 [对象] 而不是用户输入文本。

.HTML:

<input type="text" id="userInput" />
<button id="button" onClick="getText()">Insert Text</button>

您需要获取输入的值,现在您将整个输入作为对象分配给var input,因此它应该是:

var input = document.getElementById('userInput').value;