码迷,mamicode.com
首页 > 编程语言 > 详细

第三节 深入JavaScript

时间:2018-12-05 17:27:10      阅读:203      评论:0      收藏:0      [点我收藏+]

标签:参数   怎么   删除   function   length   个数   css   join   nts   

函数的返回值:(把函数体内的数据传出到函数体外)

  什么是函数的返回值:函数执行结果、可以没有返回值

  一种函数应该只返回一种类型的值

函数传参:(与函数返回值相反,把外面数据传入函数体内)

  可变参(不定参)arguments:参数的个数可变,如参数数组,例如:求所有参数的和、判断arguments.length、给参数取名,增强可读性;

    function sum() {  //对所有参数求和
      var result=0;
      for (var i=0; i<arguments.length; i++){
        result+=arguments[i];
      }
      return result;
    }
    alert(sum(12,4,6,72,8,3,7,4,68,8));

 

    //CSS函数

    function css(){
      if (arguments.length==2){ //传入两个参数,表示获取元素
        return arguments[0].style[arguments[1]];
      }else{ //传入三个参数,表示修改元素值
        arguments[0].style[arguments[1]]=arguments[2];
      }
    }
    window.onload=function () {
      var oDiv=document.getElementById(‘div1‘);
      //alert(css(oDiv,‘width‘));
      css(oDiv, ‘background‘, ‘green‘)
    };

    <div id="div1" style="width:200px; height:200px; border:1px solid black; background:red"></div>

    //上面代码可以修改为:

    function css(obj, name, value){
      if (arguments.length==2){ //传入两个参数,表示获取元素
        return obj.style[name];
      }else{ //传入三个参数,表示修改元素值
        obj.style[name]=value;
      }
    }

  取非行间样式:(上述代码中style只能取行间的样式,而非行间的,或者是外部样式表中的样式都取不了)

    currentStyle用于获取非行间样式或外部样式表中的样式,alert(oDiv.currentStyle.width); 注意:currentStyle只支持IE,Chromee,FF(火狐)不兼容。

    getComputedStyle(对象名, 任何值).样式名,用于火狐、谷歌、IE9以上等浏览器获取行间样式;例如:alert(getComputedStyle(oDiv, false).width);

    //我们要处理这种兼容问题,可以使用以下方法:
    if (oDiv.currentStyle) {
      alert(oDiv.currentStyle.width); //IE
    }else {
      alert(getComputedStyle(oDiv, false).width); //ChromeFF
    }

    //或者把上面获取样式封装成一个函数,放入自己的JS文件内,之后只需调用即可
    function getStyle(obj, name) {
      if (obj.currentStyle) {
        return obj.currentStyle[name];
      }else {
        return getComputedStyle(obj, false)[name];
      }
    }
    alert(getStyle(oDiv, ‘width‘)); //调用

    需要注意的是,上述获取样式的几个方法中有个小缺陷,它们只能获取“单一/简单样式单一/简单样式单一/简单样式单一/简单样式”比如width、height、position……;但是不能获取“复合样式”如background(background-color、background-image……),border(border-color、border-bottom……)等,但是可以取出backgroun-color等这样的单一样式。

数组基础:

  定义方法:var a=[元素, 元素, 元素, 元素, ...];  或者var a=new Array(元素, 元素, 元素, 元素, ...);  两者没有差别,第一种性能略高,因为代码短。

  数组的属性:“length”既可以获取,又可以设置;  例如:快速清空数组,只需arr.length=0;

  数组中应该只存一种类型的变量;

  数组的方法:

    添加:push(元素)  从尾部添加数据;  unshift(元素)  从头部添加数据;  从中间插入:arr.splice(开始, 长度, 元素...)  先删除,后插入,即表示用“元素...”替换被删除的元素,当被删除元素个数,即“长度”为0时,表示直接插入。

    删除:pop()  从尾部弹出数据;  shift()  从头部弹出数据;  从中间删除:arr.splice(开始,长度)

    排序:sort([比较函数]);  给一个数组排序,

      arr=[‘array‘, ‘flaot‘, ‘left‘, ‘zoo‘, ‘zero‘, ‘ten‘, ‘mom‘];  arr.sort();:排序一个字符串数组(按首字母在26个因为字母中的先后顺序,相同时继续比较下一个字母);

      arr=[11, 56, 35, 980, 45];  arr.sort();:排序一个数字数组(按数字的首位在0,1,2,3,4,5,6,7,8,9的顺序)。

      怎么解决上句数字不能按大小排序呢?

      arr.sort(function (n1, n2) {
        if (n1<n2){
          return -1;
        } else if (n1>n2){
          return 1;
        } else { //n1=n2
          return 0;
        }
      });

      //或者把上述语句简写为:

      arr.sort(function (n1, n2) {
        return n1-n2;
      });

    转换类:数组1.concat(数组2);  连接两个数组;   arr.join(分隔符)用分隔符,组合数组元素,生成字符串----对应字符串split

第三节 深入JavaScript

标签:参数   怎么   删除   function   length   个数   css   join   nts   

原文地址:https://www.cnblogs.com/han-bky/p/10070613.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!