body部分很简单,一个输入框和一个展示的div

<div>
<p>你好,<input id='nickName'></p>
<div id="introduce"></div>
</div>

逻辑部分

    <script>
var userInfo = {};
var a = '';
var inp = document.getElementById('nickName');
var odiv = document.getElementById('introduce');
Object.defineProperty(userInfo, "nickName", {
get: function(){
return inp.value;
},
set: function(nick){ }
});
Object.defineProperty(userInfo, "introduce", {
get: function(){ },
set: function(introduce){
odiv.innerHTML = introduce;
}
}) inp.addEventListener("keyup",function(){
userInfo.introduce = userInfo.nickName;
}) </script>

效果是

最新文章

  1. SSM框架总结(1)
  2. Android学习——uses-sdk标签详解
  3. android内部培训视频_第一节
  4. qt播放器
  5. 背投广告js
  6. iOS平台在ffmpeg中使用librtmp
  7. KVM之Live Migration
  8. C语言基础 - 实现动态数组并增加内存管理
  9. Libevent教程001: 简介与配置
  10. SpringBoot集成Lombok,应用+源码解析,让代码优雅起来
  11. express脚手架的安装,以及ejs的语法
  12. [angularjs] angularjs系列笔记(八)事件
  13. lua基于oopclass的属性节点类 和 集合类
  14. node cluster模块,仿多线程并发调用,
  15. Unity应用架构设计(4)——设计可复用的SubView和SubViewModel(Part 1)
  16. junit 基础使用
  17. android:onClick都做了什么
  18. 什么是pear的channel?
  19. C++图形开发相关
  20. Python单元测试框架之pytest 3 -- fixtures

热门文章

  1. Number Sequence---hdu1711(kmp)
  2. replace未全局替换的坑
  3. 兼容获取scrollTop和scrollLeft(被滚动条卷走的部分)
  4. Git&#160;使用vi或vim命令打开、关闭、保存文件
  5. su 与 su - 区别
  6. JS片段大总结
  7. testng日志 ITestListener
  8. 字典的fromkeys的用法
  9. Linux系统——文件和目录权限
  10. 145. Binary Tree Postorder Traversal(二叉树后序遍历)