简单理解Object.defineProperty 以及无刷新的更新页面
Object.defineProperty( obj , prop , descriptor ) ‘defineProperty’ 直译过来就是定义一个对象的属性 参数1, obj为目标对象,也就是你要定义属性的对象 参数2, prop为要定义或修改的属性的名称,也就是为要定义的属性起个名 参数3, descriptor为属性描述符,也就是用来描述你要定义的对象要有什么样子的属性。分为数据描述符和存取描述符。 return: 返回值是你要定义的那个对象 今天的主题是无刷新的更新页面,这对你了解数据驱动的框架的原理很有帮助。 存取描述符 其中有两个重要的两个属性就是get函数和set函数 get函数 当访问该属性时,该方法会被执行,方法执行时没有参数传入 set函数 当访问该属性时,该方法会执行。
<div id="test">这是一个测试</div>
<input type="text" class='inp' value=" 888"/>
//下面是JS代码
var view = document.getElementById("test");
var data = {};
Object.defineProperty(data, "b", {
set: function (newValue) {
view.innerHTML = newValue;
},
get: function () {}
});
setInterval(function () {
data["b"] = document.querySelector(".inp").value
}, 10);