JavaScript 中的文本框

在 JavaScript 中，可以通过 HTML 的 input 标签创建文本框，用于接收用户的输入。以下是创建一个简单的文本框的代码：

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

其中，type="text" 表示创建一个文本输入框，id="myInput" 给文本框指定了一个唯一的标识符，以便在 JavaScript 代码中对其进行操作。

通过 JavaScript 修改文本框的值

可以使用 JavaScript 修改文本框中的文本。例如，以下代码将文本框的值设置为 'Hello, world!'：

document.getElementById('myInput').value = 'Hello, world!';

其中，document.getElementById('myInput') 用于获取具有指定 id 属性的元素，.value 则表示获取或设置元素的值。

捕获文本框中的用户输入

可以使用 oninput 事件来捕获用户对文本框的输入。以下代码在文本框的值改变时触发一个函数：

document.getElementById('myInput').oninput = function() {
    console.log('Input changed!');
};

对文本框进行验证

可以使用正则表达式等手段对文本框中的输入进行验证。以下代码检查文本框中的值是否为一个有效的电子邮件地址：

var emailInput = document.getElementById('myInput');
var emailRegex = /^\S+@\S+\.\S+$/;
emailInput.oninput = function() {
    if (emailRegex.test(emailInput.value)) {
        console.log('Valid email address!');
    } else {
        console.log('Invalid email address!');
    }
};

其中，/^\S+@\S+\.\S+$/ 是一个正则表达式，它用于匹配一个有效的电子邮件地址。test(emailInput.value) 则用于测试文本框中的值是否与该正则表达式匹配。

总结

文本框是 JavaScript 中常见的输入与输出工具，可以通过 JavaScript 操作文本框中的值，并通过事件处理机制和验证等手段控制用户的输入。