zoukankan      html  css  js  c++  java
  • 监听属性改变defineProperty和文档碎片createDocumentFragment

    <!DOCTYPE html>
    <html lang="en">
    <head>
      <meta charset="UTF-8">
      <title>ll</title>
    </head>
    <body>
    <div id="el">
      <div>xxx</div>
      <div>yyy</div>
    </div>
    <script>
      const obj = {aaa: 111};
      Object.defineProperty(obj, 'aaa', {
        // value: 222,//不可与getter/setter同时使用
        // writable: true,//属性不是对象的初始属性,默认false,否则默认为true,不可重新赋值,不可与getter/setter同时使用
        // configurable: true,//默认false,属性不可被删除(浏览器严格模式下delete属性会报错)
        // enumerable: true,//属性不是对象的初始属性,默认false,否则默认为true,不可被枚举
        get() {
          return value
        },
        set(newValue) {
          console.log('赋值时会运行')
          value = newValue
        }
      });
      obj.aaa = 333
      console.log(obj)
      console.log(Object.keys(obj))
    
      var el = document.getElementById('el')
      var df = document.createDocumentFragment()
      let child = null
      while (child = el.firstChild) {
        df.appendChild(child)
      }
      df.childNodes.forEach(li => {
        if (li.nodeType === 1) {//元素节点
          li.innerText = new Date().getTime()
        } else if (li.nodeType === 3) {//文本节点
        } else {
        }
      })
      el.appendChild(df)
    </script>
    </body>
    </html>
  • 相关阅读:
    tomcat启动与关闭脚本
    SqlAlchemy ORM
    python之socket
    python异常处理
    python常用模块
    PYTHON之文件操作
    Linux系统Load average负载详细解释
    tomcat报错:This is very likely to create a memory leak问题解决
    springcloud第一步:创建eureka注册服务
    SpringCloud微服务高级
  • 原文地址:https://www.cnblogs.com/linding/p/14481837.html
Copyright © 2011-2022 走看看