一、输入及状态改变事件
(1)oninput & onpropertychange
定义: 只要输入了值就会触发时间处理函数
不支持的浏览器:
1、oninput(IE9以下不支持)
2、onpropertychange(IE11不支持,IE11以下支持)
兼容性写法: 两个都写上就可以了
(2)onchange
特点:
1、失去焦点才会触发
2、聚焦的时候和失去焦点的时候值一样就不会触发
(3)onfocus & onblur
定义: 聚焦和失去焦点时触发时间处理函数
相当于: css的:focus选择器
(4)模拟placeholder
缺点: 样式很难改
写法一:
写法二:
二、京东搜索框
(1)模块化写京东搜索框
(2)备注
1、CSS书写顺序:
2、过程化和面向对象什么时候写?
1、纯模块、不可复用的模块,可以直接用过程化的方式来写
2、比如轮播图、tab组件可复用的模块,就可以用面向对象来写
3、focus没有冒泡行为