jquery的连续调用:
var jQuery=function(){ return new jQuery.prototype.init(); } jQuery.prototype.init=function(){} jQuery.prototype.css=function(){} jQuery.prototype.init.prototype=jQuery.prototype; jQuery().css()
javascript: ECMAScript BOM DOM
ECMAScript:主要是定义了js的基本语法内容
BOM:浏览器对象模型,BOM研究的主要对象就是Window对象
DOM:文档对象模型,研究HTML文件
JavaScript:基于对象和事件驱动的具有安全性能的客户端的脚本语言
基于对象:研究对象的属性和方法
事件驱动:鼠标事件 键盘事件 表单事件 框架事件
安全性能:不能处理文件操作
客户端:浏览器,只要有浏览器的地方
js严格区分大小写
定义变量:
var name,age=‘张三’;
php数据类型:字符串、整型、浮点型、布尔型、数组、对象、null、资源
javascript数据类型:字符串、数值(整型、浮点型,NaN)、布尔型、null、undefined(未定义、定义未赋值、它本身)、对象(数组、function,Data)
检测数据类型:typeof () ()可以省略
var name ='张三' typeof name;或者typeof(name)都行
类型转换:
转字符串:String()
转布尔:Boolean()
转数值:Number()
转整型:parseInt()
转浮点:parseFloat()
JS中符号含义:
()表示函数执行
[]表示语法模拟,表示模拟Array类的实例(=new Array())
{}表示语法模拟,表示模拟Object类的实例(=new Object())
//表示语法模拟(正则对象),表示模拟RegExp类的实例(=new RegExp())
函数:
1、普通函数
function demo(){} demo();//需要调用才执行
2、匿名函数
(function(){})() //没有方法名 、无需调用,自动执行 //给匿名函数赋方法名 var demo =function(){} demo() //赋方法名后需要调用才执行了
3、new Function函数体
var demo = new Function('a','b','c','...','n','','return a+b ',);//无{}、F必须大写 //最后一个是方法体,其他的全是参数
获取函数的参数个数 arguments.length 在函数内调用
数组:
定义:
1、直接实例化
var array=new Array(10,20,30);//声明数组并且赋值 var myArray = new Array(); //声明空数组 myArray[0] = 1;//赋值 myArray[1] = 2;//赋值 myArray[2] = 3;//赋值 var arr3 = new Array(3);//声明并指定数组长度为3(没赋值前所有的值都是Undefind) arr3[0] = 1;//赋值 arr3[1] = 2;//赋值 arr3[2] = 3;//赋值
2、隐式创建
var arr=[1,2,3]; 关联数组不能象上面的直接在[]中赋值这时我们需定义一个空数组在赋值 var arr=[]; arr['name']='Tom'; arr['age']=20;
数组取值:
arr.name 或者: arr['name'];
下标从0开始的索引数组。我们可以用length获取数组的长度。但是如果时关联数组就获取不到数组长度(个数)
数组遍历:
1 常规的for循环
2、 for( var i in array ){} 原理:数组中有几个元素,for..in语句就循环执行多少次
多维数组:
var arr = [ [10,'zhangsan','male'], [11,'lisi','female'], [12,'wangwu','male'] ]; for (var i in arr){ for(var j in arr[i]){ document.write(arr[i][j]); } document.write('<br>'); }
json格式的定义
Json形式: var Json={a:1 , b:2 , c:3};
数组形式:var arr=[1,2,3];
var myArray4 = [ {"num":"1001","name":"jack","age":16}, {"num":"1002","name":"Mary","age":17}, {"num":"1003","name":"Tom","age":19} ];
对象:
几种定义方式:
1、直接定义:
var obj = new Object()//定义 O必须大写 obj.name = "lichihua"; //赋值 obj.say=function(){} //赋值 obj.name; //调用 obj.say(); //调用
2、{}方式
var person={}// 定义空对象 相当于var Person = new Object(); var person={name:'zhangsan' , age:20 , eat:function(){} } person.name;//调用 person['name'];//调用 person.eat();//调用
第三种:使用工厂模式创建对象 (不常用)
function Person(name,age){ var obj = new Object(); obj.name = name; obj.age = age; obj.sayName = function(){ alert(this.name); }; return obj; } var person1 = Person('Nike',29); var person2 = Person('Arvin',20);
4、用函数形式定义对象:
function Person(name,age){ this.name = name; this.age = age; this.sayName = function(){ alert(this.name); }; } var person1 = new Person('Nike',29); var person2 = new Person('Arvin',20);
第五种:原型创建对象模式
function Person(){} Person.prototype.name = 'Nike'; Person.prototype.age = 20; Person.prototype.jbo = 'teacher'; Person.prototype.sayName = function(){ alert(this.name); }; var person1 = new Person(); person1.sayName(); 使用原型创建对象的方式,可以让所有对象实例共享它所包含的属性和方法。 如果是使用原型创建对象模式,请看下面代码: function Person(){} Person.prototype.name = 'Nike'; Person.prototype.age = 20; Person.prototype.jbo = 'teacher'; Person.prototype.sayName = function(){ alert(this.name); }; var person1 = new Person(); var person2 = new Person(); person1.name ='Greg'; alert(person1.name); //'Greg' --来自实例 alert(person2.name); //'Nike' --来自原型
第六种:组合使用构造函数模式和原型模式
function Person(name,age,job){ this.name =name; this.age = age; this.job = job; } Person.prototype = { constructor:Person, sayName: function(){ alert(this.name); }; } var person1 = new Person('Nike',20,'teacher');
全选和反选
function check(param){ //获取所有复选框的对象组 var input = document.getElementsByTagName('input'); //获取对象组的个数 var len =input.length; //循环操作单一对象 for(var i=0;i<len;i++){ //1 全选 2全不选 3反选 switch(param){ case 1: input[i].checked=true; break; case 2: input[i].checked=false; break; case 3: input[i].checked=!input[i].checked; break; } } }
定时器:
1、不间断定时器 var s = SetInterval('js代码','毫秒数') 清除不间断定时: ClearIntervar(s) 2、单次定时(一般用于触发某个事件后掉取他) var s = SetTimeout('js代码','毫秒数') 清除单次定时: ClearTimeout(s)
js中所有的数据类型都可以作为对象:比较javascript数据类型:字符串、数值(整型、浮点型,NaN)、布尔型、null、undefined(未定义、定义未赋值、它本身)、对象(数组、function,Data)
javascript提供了11个内置对象:
Array、Boolean、Date、Function、Global、Math、Number、Object、RegExp、Error 以及 String 对象
也就是说上面的11个都可以直接用 new 来声明:如 new String() new Date() new Boolean('fales') new number('3.1415629') ...
js中所有的数据类型都可以作为对象 所以一般我们很少用到 var str = new String() 、var num =new Number() 而是直接 var str = ‘demo’; var num =20;
内置函数:
Number:
toFixed(保留小数点的位数)
String:
trim() 去掉字符串两边的空格
concat(另一个字符串) 连接两个字符串
splite(切割符) 将字符窜按指定的切割符分割,并返回数组(字符转数组?)
substr(start,length) 截取字符串
substring(strat,end) 截取字符串
search(string/preg) 从字符串中查找给定的string字符 找到返回 索引位置,没找到返回 -1 注意:preg表示也可以查找正则匹配出的字符
match(string/preg) 从字符串中查找给定的string(或者查找正则匹配出的字符)通过返回数组(格式为【查找的字符串,索引位置、输入的字符串】),不存在返回null
replace(string/preg,替换的字符) string为被替换的字符,
var str =‘你妹的,world’;
str.replace('你妹的',‘***’);将你妹的替换成***
str.replace('/你妹/','**');
str.replace('/wor/','**');
Math: 无须声明直接用
Math.ceil(数值) 进一取整
Math.floor(数值); 舍去取整
Math.round(数值); 四舍五入
Math.max(数值); 最大值
Math.min(数值); 最小值
Math.pow(数值,n次方); 幂
Math.random(数值); 随机数(0≤X<1)
获取0-5随机数
Math.floor(Math.random()*6);
获取10-100的随机数
Math.ceil(Math.random()*1000000)%((100-10)+1)+10;
获取n~m的随机数 原理 当a与b取余时 余数的范围是(b-1)
function(n,m){ return Math.ceil(Math.random()*1000000)%((m-n)+1)+n; }
Date:
getFullYear():获取年
getMonth():月
getDate():天
getHours():小时
getMinutes():分钟
getSeconds():秒数
var myDate = new Date(); // 当前时间 无参数则默认时花去当前的时间对象 document.write('当期年:'+myDate.getFullYear()); document.write('<br>当期月:'+(myDate.getMonth()+1)); document.write('<br>当期日:'+myDate.getDate()); document.write('<br>当期时:'+myDate.getHours()); document.write('<br>当期分:'+myDate.getMinutes()); document.write('<br>当期秒:'+myDate.getSeconds()); document.write('<br>当期毫秒:'+myDate.getMilliseconds()); document.write('<br>当期时间戳:'+myDate.getTime());
当new Date(参数)有参数传入时则是获取传入得日期对象
参数的格式:
1、时间戳
var d1 = new Date(1453349748749);
2、年,月,日,时,分,秒,毫,秒
var d2 = new Date(2016,1,30,12,12,12,345);
3、格式化时间 (谷歌可用 火狐不能)
var d3 = new Date('2016-1-31 12:02:02');
Array:
length
push(字符串):向数组末尾推进一个元素,返回新数组元素个数
pop():弹出最后一个元素并返回
shift():删除第一个元素并返回
unshift(字符串):向数组的开头添加一个元素,并返回数组元素个数
join(','):将数组使用指定字符串拼接成字符串,返回字符串
例子:
var arr = ['zhangsan','lisi','wangwu']; arr.length arr.push('zhaoliu'); // 4 arr.pop(); // zhaoliu arr.shift(); // zhangsan arr.unshift('one'); // 3 arr.join(':'); // one:lisi:wangwu
正则对象:
var reg = new RegExp();这种写法不常用一般使用下面定义变量的方法来声明
如: 用var reg=/[0-9]/;
reg.test(str) 匹配字符串 成功返回true,失败返回fale
事件: 这个和dom的事件句柄是一致的 我们可以将下面这些插入html中 比如: <buttom onclick="function(){...}">提交</bottom>
属性 | 当以下情况发生时,出现此事件 | FF | N | IE |
---|---|---|---|---|
onabort | 图像加载被中断 | 1 | 3 | 4 |
onblur | 元素失去焦点 | 1 | 2 | 3 |
onchange | 用户改变域的内容 | 1 | 2 | 3 |
onclick | 鼠标点击某个对象 | 1 | 2 | 3 |
ondblclick | 鼠标双击某个对象 | 1 | 4 | 4 |
onerror | 当加载文档或图像时发生某个错误 | 1 | 3 | 4 |
onfocus | 元素获得焦点 | 1 | 2 | 3 |
onkeydown | 某个键盘的键被按下 | 1 | 4 | 3 |
onkeypress | 某个键盘的键被按下或按住 | 1 | 4 | 3 |
onkeyup | 某个键盘的键被松开 | 1 | 4 | 3 |
onload | 某个页面或图像被完成加载 | 1 | 2 | 3 |
onmousedown | 某个鼠标按键被按下 | 1 | 4 | 4 |
onmousemove | 鼠标被移动 | 1 | 6 | 3 |
onmouseout | 鼠标从某元素移开 | 1 | 4 | 4 |
onmouseover | 鼠标被移到某元素之上 | 1 | 2 | 3 |
onmouseup | 某个鼠标按键被松开 | 1 | 4 | 4 |
onreset | 重置按钮被点击 | 1 | 3 | 4 |
onresize | 窗口或框架被调整尺寸 | 1 | 4 | 4 |
onselect | 文本被选定 | 1 | 2 | 3 |
onsubmit | 提交按钮被点击 | 1 | 2 | 3 |
onunload | 用户退出页面 | 1 | 2 | 3 |