zoukankan      html  css  js  c++  java
  • jq单向绑定

    维护老的,没有框架的项目的时候对于页面动态的一些数据修改就很烦,需要操作dom,但是引入框架又要重构,老项目重构,想想就可怕。

    如果我们仅仅只是简单的实现数据的绑定,或许会简单很多。

    参考大神之作:https://segmentfault.com/a/1190000021242882

    //获取dom
    var el = document.getElementById(htmlId);
    //获取页面所有dom var template = el.innerHTML;
    //重写 var data = new Proxy(chEnTextHtml[languageType], { set:function(obj, name, value) { obj[name] = value; render(); } }); render();
    //使用的是双大括号,此处替换大括号内容 function render() { el.innerHTML = template.replace(/{{w+}}/g, function(str){ str = str.substring(2, str.length - 2); return chEnTextHtml[languageType][str]; }); }

    但是这个是不兼容ie浏览器的,主要是proxy是es6的内容,ie浏览器是很恶心的,不兼容该方法,只能引入插件es6-proxy-polyfill使其兼容ie浏览器。

    这个插件非常好用,所有用到proxy的项目都可以使用这个插件,毕竟大多数网站还是要求兼容IE的。

    问题都解决了,最后还有一个问题,那就是会在页面加载的时候闪现一下自定的大括号内容:{{自定义}},在vue中可以使用v-loack来解决,jq和js中暂时没有去想怎么解决,我想可以参考vue的loack来进行解决

  • 相关阅读:
    正则表达式-元字符
    利用shell脚本实现nginx 的logs日志分割
    Linux下 nfs部署
    Linux下 niginx部署
    linux 硬盘分区与格式化挂载 (二)
    linux 硬盘分区与格式化挂载
    linux 系统监控
    [LeetCode] Best Time to Buy and Sell Stock
    [LeetCode] Convert Sorted Array to Binary Search Tree
    [LeetCode] Binary Tree Inorder Traversal
  • 原文地址:https://www.cnblogs.com/sixrookie/p/14884584.html
Copyright © 2011-2022 走看看