使用 JavaScript 添加所需的输入

在 Web 开发中，我们经常需要从用户获取输入，例如表单字段或搜索框。为此，我们可以使用 JavaScript 添加所需的输入。本文将介绍如何使用 JavaScript 在 Web 页面中添加文本框、下拉列表和复选框。

添加文本框

要添加一个文本框，我们需要创建一个 input 元素，其类型为 text。以下是一个示例：

<input type="text" id="myText">

上面的代码将创建一个 ID 为 myText 的文本框。要获取用户在文本框中输入的文本，我们可以使用以下 JavaScript 代码：

const input = document.getElementById("myText");
const text = input.value;

其中 document.getElementById("myText") 将返回 ID 为 myText 的元素对象，input.value 将返回用户在文本框中输入的文本。

添加下拉列表

要添加一个下拉列表，我们需要创建一个 select 元素，并在其中添加 option 元素。以下是一个示例：

<select id="mySelect">
  <option value="option1">选项 1</option>
  <option value="option2" selected>选项 2</option>
  <option value="option3">选项 3</option>
</select>

上面的代码将创建一个 ID 为 mySelect 的下拉列表，并将默认值设置为 option2。要获取用户选择的选项，我们可以使用以下 JavaScript 代码：

const select = document.getElementById("mySelect");
const value = select.value;

其中 select.value 将返回用户选择的选项的值。

添加复选框

要添加一个复选框，我们需要创建一个 input 元素，其类型为 checkbox。以下是一个示例：

<input type="checkbox" id="myCheckbox" name="myCheckbox" value="value1">
<label for="myCheckbox">复选框</label>

上面的代码将创建一个 ID 为 myCheckbox 的复选框。要获取用户是否选中了复选框，我们可以使用以下 JavaScript 代码：

const checkbox = document.getElementById("myCheckbox");
const checked = checkbox.checked;

其中 checkbox.checked 将返回一个布尔值，表示复选框是否被选中。

以上就是如何使用 JavaScript 添加所需的输入，希望本文能对你有所帮助！