第三节 深入JavaScript
函数的返回值:(把函数体内的数据传出到函数体外)
什么是函数的返回值:函数执行结果、可以没有返回值
一种函数应该只返回一种类型的值
函数传参:(与函数返回值相反,把外面数据传入函数体内)
可变参(不定参)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); //Chrome、FF
} //或者把上面获取样式封装成一个函数,放入自己的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的更多相关文章
- 第一百三十三节,JavaScript,封装库--弹出登录框
JavaScript,封装库--弹出登录框 封装库,增加了两个方法 yuan_su_ju_zhong()方法,将获取到的区块元素居中到页面,chuang_kou_shi_jian()方法,浏览器窗口事 ...
- 第一百二十三节,JavaScript错误处理与调试
JavaScript错误处理与调试 学习要点: 1.浏览器错误报告 2.错误处理 3.错误事件 4.错误处理策略 5.调试技术 6.调试工具 JavaScript在错误处理调试上一直是它的软肋,如果脚 ...
- 第一百一十三节,JavaScript文档对象,DOM基础
JavaScript文档对象,DOM基础 学习要点: 1.DOM介绍 2.查找元素 3.DOM节点 4.节点操作 DOM(Document Object Model)即文档对象模型,针对HTML和XM ...
- 第一百零三节,JavaScript对象和数组
JavaScript对象和数组 学习要点: 1.Object类型 2.Array类型 3.对象中的方法 什么是对象,其实就是一种类型,即引用类型.而对象的值就是引用类型的实例.在ECMAScript中 ...
- 第一百四十三节,JavaScript,利用封装库做百度分享
JavaScript,利用封装库做百度分享 效果图 html代码 <div id="share"> <h2>分享到</h2> <ul> ...
- 学习javascript基础知识系列第三节 - ()()用法
总目录:通过一段代码学习javascript基础知识系列 注意: 为了便于执行和演示,建议使用chrome浏览器,按F12,然后按Esc(或手动选择)打开console,在console进行执行和演示 ...
- 2014年辛星完全解读Javascript第三节
经过第一节的入门和第二节的运算符,那么接下来我们就可以学习Javascript的函数了,当然了,不管大家之前学习的是什么编程语言,都会有函数的概念,如果大家学的是Pascal,还会有”过程“的概念,但 ...
- 2014年辛星Javascript解读第三节
经过第一节的入门和第二节的运算符.那么接下来我们就能够学习Javascript的函数了,当然了.无论大家之前学习的是什么编程语言.都会有函数的概念,假设大家学的是Pascal,还会有"过程& ...
- 第一百五十三节,封装库--JavaScript,表单验证--备注字数验证
封装库--JavaScript,表单验证--备注字数验证 效果图 html <div id="reg"> <h2 class="tuo"> ...
随机推荐
- js小数点精度问题
项目背景是用eharts 渲染数据,其中Y 轴的 刻度尺间隔用 interval,代码中如下: yAxis: [ { type : 'value', position:'left', min:minV ...
- spring框架中的注解
- centos7安装Lua
网官有介绍安装:http://www.lua.org/start.html 由于之前我遇到过致命错误并纪录在:https://blog.csdn.net/bingbingtea/article/det ...
- numpy.meshgrid()
numpy提供的numpy.meshgrid()函数可以让我们快速生成坐标矩阵X,Y 语法:X,Y = numpy.meshgrid(x, y)输入:x,y,就是网格点的横纵坐标列向量(非矩阵)输出: ...
- vue父子组件写法,数据传递,顺便封装 element-ui的弹窗组建
父组件如下: <template> <div class="print"> <el-button @click="bbclick" ...
- element-ui的滚动条组件el-scrollbar(官方没有)
<template> <div style="height:600px;"> <el-scrollbar style="height:100 ...
- unity3d-游戏实战突出重围,第三天 绘制数字
实现效果: 准备资源 using UnityEngine; using System.Collections; public class hznum : MonoBehaviour { //存储图片资 ...
- 16.和input相关的知识点
1.改变input里面placeholder颜色 <input class="pre_name" type="text" placeholder=&quo ...
- MYSQL 5.7修改密码,登录问题
mysql5.7 关于密码问题 报错: ERROR 1862 (HY000): Your password has expired. To log in you must change it usin ...
- JDK源码调试常见错误。
1.删除不需要的代码,即swing相关的代码 2.执行命令时要将前提环境进入文件夹如下: 起初没有完全执行第一条,因为网上说可以根据需要选择相关的代码,于是就没有删除,以后第一次模仿网上的例子的时候要 ...