如何将跨度文本转换为输入表单答案

【问题标题】：How to get span text into input form如何将跨度文本转换为输入表单
【发布时间】：2021-09-29 21:37:44
【问题描述】：

我正在尝试将 span 类中的文本显示到输入表单中。我几乎尝试了我能想到的所有方法，但没有任何效果。

类似

请帮忙！ (https://i.stack.imgur.com/AVWbG.jpg)

【问题讨论】：

How to Ask 欢迎来到 SO - 提问时请阅读此内容

标签： javascript html forms class input

【解决方案1】：

下次，请发布您已经尝试过的内容。

在 Javascript 中，你可以这样做：

const inputField = document.getElementById(...);
const spanField = document.getElementById(...);
inputField.value = spanField.textContent;

【讨论】：

【解决方案2】：

在向世界各地的开发人员提问之前，请先检查一下。检查How do I ask a good question? 我会建议您在使用它们之前正确学习。你需要展示你做了什么。

然而，如果需要在输入字段中显示文本，可以使用 PLACEHOLDER。

 <!DOCTYPE html>
<html>
<head>
    <title>Demo</title>
</head>
<body>

    <div>
        <span class='text'>here is some text</span>
        <input type='text' class='input' />
    </div>

<script type="text/javascript">
    document.querySelector('.input').value = document.querySelector('.text').innerHTML
</script>

</body>
</html>

这可能会立即解决您的问题！请参阅 JavaScript 方法Here

【讨论】：

【解决方案3】：

如果我有你的问题；

document.querySelector('.input').value = document.querySelector('.text').innerHTML

<div>
<span class='text'>here is some text</span>
<input type='text' class='input' />

</div>

现在将 javascript 放在哪里取决于。

如果您想在窗口加载后立即执行；

document.addEventListener('DOMContentLoaded', () => {
// here goes the javascript

})

如果您想通过单击按钮来执行此操作；

document.getElementById('id_of_button').addEventListener('click', () => {

// here goes the javascript
})

【讨论】：

是的，这就是我真正想要的，但现在我不确定我应该如何以及在哪里放置 javascript 部分，请帮忙。?（这里是初学者）
让我编辑我的答案。我会把细节放在那里