凡事就怕较真, 较真必有成长, 开始~
1. 保存接口获取输入框数据
- let obj = {
- name : " " ,
- age: " " ,
- sex: " " ,
- height: " " ,
- } ;
- $.each( obj , function ( key , value) {
- obj [ key ] = $('input[name=' + key + ']').val() ;
- }) ;
- console.log(obj) ; // {
- name: "张三", age: "13", sex: "男", height: "100cm"
- }
多余的 obj 属性获取到是 undefined,delete 掉或者重新赋值, 看实际情况. 我在项目用的 handlebars, 直接 tpl 模板传入数据, 数据回显相当舒服 (和后台要接口文档的重要性 o(╯□╰)o).
2. 数据里面有 "'" 单引号在个别特殊场景 JSON.stringify 会有问题.
- <body>
- <div id="test">
- </div>
- </body>
- <script>
- let data = {};
- data.content = "你好' '你好'你好 ";
- data.age = 13;
- data = JSON.stringify(data);
let html = '<p data-p = \' '+ data +' \ '> 你是个好人 </p>' ;
- $('#test').HTML(HTML) ;
- console.log( $('#test p').attr('data-p') ) ; // {
- "content":" 你好
- </script>
这种可能用户输入的内容里面有两个单引号, 也可能存在 XSS 注入的情况, 获取数据都会有问题.
之前在项目用的一个解决方法就是在 JSON.stringify 之前把单引号替换成转义符 "'".
- data.content = data.content.replace( /(')/g ," ' " ) ;
- let objType = JSON.parse( $('#test p').attr('data-p')) ;
- console.log( objType ) ; // {content: "你好''你好'你好", age: 13}
- Object.prototype.toString.call( objType ) ; // [object Object]
这样获取以及渲染在 DOM 都一切正常.
3. 判断数据类型
- Object.prototype.toString.call() ;
- Object.prototype.toString.call('1') ; // [object String]
- Object.prototype.toString.call(1) ; // [object Number]
4.CSS 加载是由上而下, 从右至左, 防止 FOUC 应该尽量避免用 @import 引入, 建议在 head 标签里用 link 加载 CSS, 兼容性也好.
说到加载请求, 我一般不太喜欢用 CSS sprites, 虽然可以减少请求次数, 但是在 http2 多路复用下, 它的优势已经小了很多. 伴随着管理麻烦, 更
新一个图标就要更新整张图片.
5.Chrome 浏览器让字体小于默认最小的 12px.
设置 transform: scale( );// transform: scale( 0.5 , 0.5 ); 只有 Chrome 有最小 12px 限制, IE,Firefox 最小都可以为 0.
月亮不睡我不睡, 悍匪都是小宝贝, 没有什么条理, 想到什么写了什么, 以上~
来源: http://www.jianshu.com/p/7ac8097b485f