js實現數據的雙向綁定

今天用原生js來實現一個數據的雙向綁定

知識點：object.defineProperty()

　　三個參數：

　　　　第一個：要定義屬性的對象，

　　　　第二個：要定義或者修改的屬性的名稱

　　　　第三個：將被定義或者修改的屬性的描述

 

<input type="text" id="inp"/>
<p id="showText"></p>

<script>
　　var obj = {};
　　Object.defineProperty(obj,"newProp",{
　　　　get:function(){
　　　　　　return obj;
　　　　},
　　　　set:function(newVal){
　　　　　　document.getElementById("inp").value = newVal;
　　　　　　document.getElementById("showText").innerHTML = newVal;
　　　　}
　　})
　　document.addEventListener("keyup",function(e){
　　　　obj.newProp = e.target.value;
　　})

</script>