文章目录

    这里记录的是在练习百度的2016IFE任务时的笔记,因为是边学边记所以也比较零散,仅供自己平日记录。

1.

1
2
3
4
5
6
7
8
9
<link rel="stylesheet" media="screen and (min-width:768px)" href="css/task_1_8_1_min-768.css">
@media screen and (min-width: 768px){}
[class*='col-md-']{
float: left;
min-height: 1px;
width: 8.33%;
padding:10px;
}

  1. 键盘输入 onkeyup event.keyCode ===13
  2. 按照二维数组中的某一项进行排序:

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    aqiData.sort(function(a,b){
    // if(a[1]>b[1]){
    // return -1;
    // }
    // if(a[1]<b[1]){
    // return 1;
    // }
    // return 0;
    return b[1]-a[1];
    });
  3. 只有数字 /^[0-9]+/g
    只有汉字与英文字符 /^[\u4e00-\u9fa5a-zA-Z]+$/g

  4. 提前给可能未出现的按钮绑定点击事件:
    在父元素上添加事件,利用事件的冒泡机制在以后可能出现的子元素上进行捕捉

    1
    2
    3
    4
    5
    6
    ife-task16
    document.getElementById("aqi-table").addEventListener('click',function(event){
    if(event.target.nodeName.toLowerCase() ==="button"){
    delBtnHandle.call(null,event.target.dataset.city);
    }
    },false);

    对于在事件处理程序中添加的这个参数可以是添加在子元素中的 类似 data-city 的属性。

  5. Js中关于clientWidth、offsetWidth、scrollWidth
  • offsetWidth :width+padding+border
  • offsetHeight :Height+padding+border
  • clientWidth: 获取对象可见内容的宽度,不包括滚动条,不包括边框;
  • clientHeight: 获取对象可见内容的高度,不包括滚动条,不包括边框;
  1. 对象的直接赋值是浅拷贝。
    深拷贝: js arr.slice(0) 、arr.concat();

    1
    2
    3
    4
    5
    6
    7
    var deepCopy= function(source) {
    var result={};
    for (var key in source) {
    result[key] = typeof source[key]===’object’? deepCopy(source[key]): source[key];
    }
    return result;
    }
  2. 1em 定义为一个给定字体的font-size;一般设置基字号1em = 10px;浏览器默认字号是16px,10/16 ~ 62.5%,所以主体字号将设置成

    1
    2
    3
    body{
    font-size:62.5% ;
    }
  3. undefined 与null
    null 表示“没有对象”,即此处不应该有值。典型用法:

  • 作为函数的参数,表示该函数的参数不是对象
  • 作为对象原型链的终点

    1
    2
    Object.getPrototypeOf(Object.prototype)
    //null

    undefined 表示“缺少值”,就是此处应该有一个值,但是还没有定义。 典型用法:

  • 变量被声明了,但没有赋值时,就等于undefined
  • 调用函数时,应该提供的参数没有提供,该参数等于undefined
  • 对象没有赋值的属性,改属性的值是undefined。
  • 函数没有返回值是,默认返回undefined
  1. 图像是一种二进制文件。base64 将一幅图片编码成一串字符串,使用该字符串代替图像。当图片很小时,好于 css spirites.
    src=”data:image/jpg;base64,….”
    url(“data:image/jpg:….”)
    data URIS : 允许将一个小文件进行编码后嵌入到,另一个文档中。
  2. 字间距1.75 行间距10, 14号微软雅黑 #333
    12.

    1
    2
    3
    4
    5
    6
    7
    8
    9
    function defined(value) {
    return value !== undefined && value !== null;
    }
    goog.isDef = function(val) {
    // void 0 always evaluates to undefined and hence we do not need to depend on
    // the definition of the global variable named 'undefined'.
    return val !== void 0;
    };
  3. 对象的属性类型有数据属性与访问器属性。自己在平时项目中主要使用的是数据属性,主要用到的是数据属性的[[value]]特性。而在看开源库的源码时会遇见访问器属性,即

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    var obj={
    _name:"SS",
    _age:2
    };
    Object.defineProperty(obj,'name',{
    get:function(){
    return this._name;
    },
    set:function(name){
    this._name = name;
    }
    })

    加下划线_name 是一种常用的记号,用于表示只能通过对象方法访问的属性。使用访问器属性的常见方式是设置一个属性的值会导致其他属性发生变化。

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    Object.defineProperty(obj,'age',{
    get:function(){
    return this._age
    },
    set:function(age){
    if(age>18){
    this._age = age;
    this._name = this._name.toLowercase();
    }
    }
    })
    obj.age =19;
  4. 一点需要注意的事情

    1
    2
    3
    4
    5
    6
    function a(arr){
    arr[0]++;
    }
    var arr=[1];
    a(arr);
    console.log(arr);//[2]
    1
    2
    3
    4
    5
    6
    function a(arr){
    arr=[];
    }
    var arr=[1];
    a(arr);
    console.log(arr);//[1]

    出现第二种情况是因为,在函数内部 arr是个临时指针,后来改变了临时指针的指向,但不会影响到原来的指针。^^

  5. npm install –save 与 npm install –save-dev 区别
    当为模块安装一个依赖模块时,正常情况下你得先安装他们(在模块根目录下npm install module-name),然后连同版本号手动将他们添加到模块配置文件package.json中的依赖里(dependencies)。
    -save和save-dev可以省掉你手动修改package.json文件的步骤。

    npm install module-name -save 自动把模块和版本号添加到dependencies部分
    npm install module-name -save-dve 自动把模块和版本号添加到devdependencies部分
    至于配置文件区分这俩部分, 是用于区别开发依赖模块和产品依赖模块, devDependencies只用于开发阶段完成集成测试等功能模块依赖;

文章目录