2018.11.05工作中小记JS

1.对象的长度不能用.length获取，用js原生的Object.keys可以获取到，或者用for in里a++

$('#productName').bind('input propertychange', function() {searchProductClassbyName();});     
//  input输入时触发的事件

3.canvas：
使用 toDataURL() 方法，可以导出在 <canvas> 元素上绘制的图像。这个方法接受一个参数，即图
像的 MIME 类型格式，而且适合用于创建图像的任何上下文。

4.移动端click问题解决：<meta name="viewport" content="width=device-width">
还有第三种办法就是设置CSS： Chrome和Safari都可以生效

html{
        touch-action: manipulation;
}

5.视口设置
width=640，是根据psd图来设置，有多宽设置多宽（设计图是640的设置640）
，移动端写px

<meta content="target-densitydpi=device-dpi,width=640" name="viewport">

6.表格布局常用点：

table：border="3" borderColor="#000" width="100%"    bgColor  背景颜色
td： rowspan="5" 纵向（必须删掉多余的td元素）    colspan="5"  横向
border-collapse="collapse" 边框合并   cellpadding="0" cellspacing="0"

7.发短信，winphone系统无效 <a href="sms:10086">发短信给: 10086</a> 引用视频<input type=file accept="video/*">

8.手机video 都可以在页面中播放，而不是全屏播放了。

<video id="myvideo" src="test.mp4" webkit-playsinline="true"></video>

9.深拷贝的两种方式

var obj1 = { a: 10, b: 20, c: 30 };
var obj2 = { a: obj1.a, b: obj1.b, c: obj1.c };
obj2.b = 100;
console.log(obj1);
// { a: 10, b: 20, c: 30 } <-- b 沒被改到
console.log(obj2);
// { a: 10, b: 100, c: 30 }

Object.assign，ES6 的新函数，可以帮助我们达成跟上面一样的功能。
obj1 = { a: 10, b: 20, c: 30 };
obj2 = Object.assign({}, obj1);
obj2.b = 100;
console.log(obj1);
// { a: 10, b: 20, c: 30 } <-- 沒被改到
console.log(obj2);
// { a: 10, b: 100, c: 30 }

转成 JSON 再转回来    JSON.parse(JSON.stringify(xxx.xxx))
用JSON.stringify把对象转成字符串，再用JSON.parse把字符串转成新的对象。
缺点：只有可以转成JSON格式的对象才可以这样用，像function没办法转成JSON。

10.箭头函数中的this指向的是定义时的this，而不是执行时的this

$(function(){
    $('#username').bind('input propertychange', function() {
        $('#result').html($(this).val().length + ' characters');
    });

})
$("span:contains('全体会议')")

function Percentage(number1, number2) { 
    return (Math.round(num / total * 10000) / 100.00 + "%");// 小数点后两位百分比

}  计算百分比        2/10 × 100% = 20%

由百分数计算回整数 用百分数的数字乘以0.01，或者将小数点向左移动两位，将3%转换成0.03。
console.log(Math.round(2 / 14 * 100) + "%") 这种方法不会保留小数

---

ts文件转换 命令行：tsc demo.js