前端之js双向数据绑定
来源:互联网 发布:手办 预订软件 编辑:程序博客网 时间:2024/05/01 22:34
<!DOCTYPE html><html><head> <title>textBind</title> </head><body><input type="text" name="infoInsert"> <p id="infoShow"></p><script type="text/javascript"> var obj = { seeYou: 'Hello' }; Object.defineProperty(obj, 'infoBind', { get: function () { return this.seeYou; }, set: function (newValue) { document.getElementById('infoShow').innerText = newValue; document.getElementsByName('infoInsert')[0].value = newValue; } }); document.getElementsByName('infoInsert')[0].addEventListener('keyup', function () { obj.infoBind = this.value; });</script></body></html>通过以上代码,不难看出框架中使用的双向数据绑定的底层实现原理是通过ES5中的defineProperty属性来实现的
阅读全文
0 0
- 前端之js双向数据绑定
- 手写JS双向数据绑定
- vue.js双向数据绑定
- JS原生数据双向绑定
- js实现双向数据绑定
- 数据绑定之Binding双向绑定
- 用原生js实现数据双向绑定
- Vue.js学习 Item4 -- 数据双向绑定
- vue.js表单数据双向绑定
- Angular JS中的数据双向绑定
- angular.js学习(1)--双向数据绑定
- js原生代码实现数据双向绑定
- js发布订阅实现双向数据绑定
- Vue.js双向数据绑定原理
- vue.js双向数据绑定实现原理
- angular.js 双向数据绑定,依赖注入
- 原生js 实现双向数据绑定
- 前端_双向绑定
- [LeetCode] 620.Not Boring Movies
- 《Python学习手册》学习笔记(25)之第25章OOP:宏伟蓝图(关键词:编程语言/Python/面向对象/OOP)
- C++ 获取CPU ID的方法
- BZOJ1130: [POI2008]POD Subdivision of Kingdom
- LVS原理与使用(4)
- 前端之js双向数据绑定
- transform
- java--集合-Map
- CentOS 7升级python
- 2017年,我们为什么要学习C++?
- Java并发编程:volatile关键字解析
- STM32-USART
- json与jsonp之间的区别
- Context.LAYOUT_INFLATER_SERVICE的使用