<input type="text">
<span id="text"></span>

<script>
/*
    * Object.defineProperty()方法会直接定义或修改一个新对象并返回这个对象
    * Object.defineProperty('需要定义属性的当前对象','需要定义的名称','属性描述')*/
 var text = document.getElementById('text');
var data = {};
 var value = '';//全局变量用于set和get
Object.defineProperty(data, "name", {
        //获取getter
        get(){
            return value;
        },
    //    监听数据发生变化，设置值
        set(val){
            console.log("val",val)
            text.innerText = val
            value = val;
        }

    })
 //监听input事件
    window.addEventListener('input',function (e) {
        data.name = e.target.value;

    })


</script>