input输入内容变色

你可以使用 JavaScript 来实现输入框中输入内容变色的效果。以下是一个示例：

HTML 代码：

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

CSS 代码：

#input {
  width: 200px;
  padding: 10px;
  font-size: 16px;
  border: 1px solid #ccc;
}

JavaScript 代码：

// 获取元素对象
var input = document.getElementById('input');

// 监听输入框的输入事件
input.addEventListener('input', function() {
  // 获取输入框中的文本内容
  var text = input.value;
  
  // 将文本内容的前三个字符变为红色
  var coloredText = '<span style="color: red;">' + text.substr(0, 3) + '</span>' + text.substr(3);
  
  // 将变色后的文本内容设置为输入框的值
  input.value = coloredText;
});

在 JavaScript 代码中，我们监听了输入框的 `input` 事件，当输入框中的文本内容发生变化时，将前三个字符变为红色，并将变色后的文本内容设置为输入框的值。你可以根据你的实际需求来修改变色的逻辑。