<html>
<head>
<meta charset=utf-8>
</head>
<body>
<input id="input" type="text" /> // input输入框
<span id="span"></span> // span 标签显示input内容
<script type="text/javascript">
// 补全代码
let input_id = document.querySelector('#input') // 获取 input框的dom元素
let span_id = document.querySelector('#span') // 获取span标签的dom元素
input_id.onchange = function(){ // 给input框写上事件
span_id.innerText = this.value // 把input 框的内容展示到dom上
} // 注意这里有一个问题,input框内容改变span标签展示内容不是实时改变,需要input框失去焦点,span 标签内容才会改变
</script>
</body>
</html>
原生js实现表单单向绑定
最新推荐文章于 2022-07-11 16:56:31 发布