【JavaScript】——input元素的oninput事件和onchange事件

//第一种：直接在元素标签上添加oninput属性，属性值为处理事件函数的调用
 
<input type="text" id="input" oninput="handleInput()"></input>
 
function handleInput() {
	// 处理事件代码
}
 
 
 
 
//第二种：获取input元素，然后在元素对象上添加oninput属性，属性值为函数，函数内部为处理事件函数的调用
 
<input type="text" id="input"></input>
 
var inputEle = document.querySelector('#input')
inputEle.oninput = function() {
	handleInput()
}
function handleInput() {
	// 处理事件代码
}
 
 
 
 
 
第三种：获取input元素，然后在元素上利用事件监听添加input事件
 
<input type="text" id="input"></input>
 
var inputEle = document.querySelector('#input')
inputEle.addEventListener('input', handleInput)
function handleInput() {
	// 处理事件代码
}