SOURCE

  var model = document.querySelector("#model");
  var modelText = document.querySelector("#modelText");
  var btn =document.getElementById("button")
//   var defaultName = "default value";
  var userInfo = {}
//   model.value = null;
  Object.defineProperty(userInfo, "name", {
    get: function () {
      return defaultName;
    },
    set: function (value) {
    //   defaultName = value;
      model.value = value;
      console.log("-----value");
      console.log(value);
      modelText.textContent = value;
      btn.innerHTML =value
    }
  })

  userInfo.name = "new value";
  var isEnd = true;

  model.addEventListener("keyup", function () {
    if (isEnd) {
      userInfo.name = this.value;
    }
  }, false)
  //加入监听中文输入事件
  model.addEventListener("compositionstart", function () {
    console.log("开始输入中文");
    isEnd = false;
  })
  model.addEventListener("compositionend", function () {
    isEnd = true;
    console.log("结束输入中文");
  })

  <input type="text" id="model"><br/>
  <div id="modelText"></div>

  <button id="button"></button>