1. 重写DOM原型
var desc = Object.getOwnPropertyDescriptor(HTMLInputElement.prototype, 'value') Object.defineProperty(HTMLInputElement.prototype, 'value', { ...desc, set(v) { console.log('set',v); desc.set.call(this, v) } })
Object.getOwnPropertyDescriptor(obj, prop) :
描述:该方法允许对一个属性的描述进行检索。在 Javascript 中， 属性 由一个字符串类型的“名字”（name）和一个“属性描述符”（property descriptor）对象构成
obj: 需要查找的目标对象
prop: 目标对象内属性名称
返回值:如果指定的属性存在于对象上，则返回其属性描述符对象（property descriptor），否则返回 undefined
Object.defineProperty(obj, prop, descriptor) :
obj: 要定义属性的对象。
prop: 要定义或修改的属性的名称或Symbol
descriptor: 要定义或修改的属性描述符。
返回值:被传递给函数的对象。
查看详细信息
2. JavaScript修改值后手动触发对应事件
...赋值操作 // 创建事件, 事件类型可能包括"UIEvents", "MouseEvents", "MutationEvents", 或者 "HTMLEvents" const ev = document.createEvent("HTMLEvents"); // 定义事件名为change ev.initEvent("change", false, true); // 触发事件 inputEl.dispatchEvent(ev);
event.initEvent(type, bubbles, cancelable):
type: 事件的类型。
bubbles: 一个Boolean值，决定是否事件是否应该向上冒泡. 一旦设置了这个值，只读属性Event.bubbles也会获取相应的值
cancelable: 一个Boolean值，决定该事件的默认动作是否可以被取消. 一旦设置了这个值，只读属性Event.cancelable也会获取相应的值
监听input的值改变(JavaScript直接赋值)
©著作权归作者所有,转载或内容合作请联系作者
- 文/潘晓璐 我一进店门，熙熙楼的掌柜王于贵愁眉苦脸地迎上来，“玉大人，你说我怎么就摊上这事。” “怎么了？”我有些...
- 文/花漫 我一把揭开白布。 她就那样静静地躺着，像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上，一...
- 文/苍兰香墨 我猛地睁开眼，长吁一口气：“原来是场噩梦啊……” “哼！你这毒妇竟也来了？” 一声冷哼从身侧响起，我...
推荐阅读更多精彩内容
- Object的defineProperty和defineProperties这两个方法在js中的重要性十分重要，主...
- 目前监听JS中的变量变化的方法很多，流行的MVVM的JS库/框架的共同特点就是数据绑定， 在数据变更后响应式的自动...
- 在javascript的类中,可以用 __ defineGetter __和 __ defineSetter __...
- vue中的双向数据绑定，数据监听用起来很方便，其实也可以自己实现一个简单的监听功能，一起来看看 getter和se...
